/* ------------------------------------------------------------------
   GMAO V1 - application theme on top of Skote (bootstrap / app / icons)
   Same rules on every screen: dense, professional, purple accents.
   ------------------------------------------------------------------ */
@font-face { font-family: 'Poppins'; font-weight: 300; font-style: normal; src: url(../fonts/poppins/Poppins-Light.ttf) format('truetype'); font-display: swap; }
@font-face { font-family: 'Poppins'; font-weight: 400; font-style: normal; src: url(../fonts/poppins/Poppins-Regular.ttf) format('truetype'); font-display: swap; }
@font-face { font-family: 'Poppins'; font-weight: 500; font-style: normal; src: url(../fonts/poppins/Poppins-Medium.ttf) format('truetype'); font-display: swap; }
@font-face { font-family: 'Poppins'; font-weight: 600; font-style: normal; src: url(../fonts/poppins/Poppins-Medium.ttf) format('truetype'); font-display: swap; }
@font-face { font-family: 'Poppins'; font-weight: 700; font-style: normal; src: url(../fonts/poppins/Poppins-Bold.ttf) format('truetype'); font-display: swap; }

:root {
  /* default theme; a project theme (css/themes/<id>.css) redefines these values */
  --g-primary: #7a6fbe;
  --g-primary-rgb: 122, 111, 190;
  --g-primary-light: #8177c2;
  --g-primary-dark: #625998;
  --g-soft: #ece9f8;
  --g-hover: #faf9fd;
  --g-unread: #f6f5fc;
  --g-line: #e5e3f3;
  --g-dashed: #b9b5d9;
  --g-sidebar: #2b3a4a;
  --g-sidebar-text: #b6c2d0;
  --g-sidebar-title: #8796a8;
  --g-sidebar-active: rgba(255, 255, 255, .06);
  --g-sidebar-user: #7a6fbe;
  --g-page: #f4f4f6;
  --g-font: 'Poppins', sans-serif;
  --g-radius: 3px;
  --g-title: #495057;
  --g-auth-bg: #ececf1;
  --g-auth-radius: 6px;
}
body { font-family: var(--g-font); background-color: var(--g-page); font-size: 13px; }
.page-content { padding-bottom: 50px; }

/* ---------- sidebar (dark blue-grey, as the existing application) ---------- */
body[data-sidebar=dark] .vertical-menu,
body[data-sidebar=dark] .navbar-brand-box { background: var(--g-sidebar); }
body[data-sidebar=dark] #sidebar-menu ul li a { color: var(--g-sidebar-text); font-size: 13.5px; padding: .55rem 1.5rem; }
body[data-sidebar=dark] #sidebar-menu ul li a i { color: var(--g-sidebar-text); min-width: 1.9rem; font-size: 1.15rem; }
body[data-sidebar=dark] #sidebar-menu ul li a:hover,
body[data-sidebar=dark] #sidebar-menu ul li a:hover i,
body[data-sidebar=dark] .mm-active > a,
body[data-sidebar=dark] .mm-active > a i { color: #fff !important; }
body[data-sidebar=dark] .mm-active > a { background: var(--g-sidebar-active); }
body[data-sidebar=dark] .menu-title { color: var(--g-sidebar-title) !important; font-weight: 600; letter-spacing: .04em; }
@media (min-width: 992px) { .vertical-menu { display: flex; flex-direction: column; } }
@media (max-width: 991.98px) { body.sidebar-enable .vertical-menu { display: flex; flex-direction: column; } }
.vertical-menu .sidebar-scroll { flex: 1 1 auto; min-height: 0; }
.sidebar-user { flex: 0 0 auto; background: var(--g-sidebar-user); color: #fff; text-align: center; padding: 14px 10px; font-weight: 600; font-size: 13px; }
.sidebar-user small { display: block; font-weight: 400; opacity: .85; font-size: 11px; }
body.vertical-collpsed .sidebar-user { display: none; }
.navbar-brand-box .brand-text { color: #fff; font-weight: 500; font-size: 17px; letter-spacing: .02em; vertical-align: middle; }
.navbar-brand-box .brand-icon { color: #fff; font-size: 22px; vertical-align: middle; margin-right: 6px; }
body.vertical-collpsed .navbar-brand-box .brand-text { display: none; }
.navbar-brand-box .brand-logo { max-height: 34px; max-width: 170px; vertical-align: middle; }
.navbar-brand-box .brand-logo-sm { max-height: 22px; max-width: 46px; vertical-align: middle; }
.brand-logo-white { filter: brightness(0) invert(1); }

/* ---------- top bar ---------- */
#page-topbar { box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.btn-create { background: #f3f3f9; border: 0; color: #343a40; font-weight: 500; padding: .45rem .9rem; border-radius: 4px; }
.btn-create:hover, .btn-create.show { background: #e9e9ef; color: #000; }
.header-lang img { height: 14px; margin-right: 8px; }
.noti-icon .badge { position: absolute; top: 15px; right: 6px; }
.noti-item { display: block; padding: .6rem 1rem; color: #495057; border-bottom: 1px solid #f1f1f4; }
.noti-item:hover { background: #f8f8fb; }
.noti-item.unread { background: var(--g-unread); }
.avatar-initials { width: 32px; height: 32px; border-radius: 50%; background: var(--g-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: 12px; }
.avatar-code { font-size: 10px; letter-spacing: -.02em; }
.avatar-project { background: #fff; border: 1px solid var(--g-line); overflow: hidden; padding: 3px; }
.avatar-project img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }

/* ---------- page header ---------- */
.page-title-box { padding-bottom: 18px; }
.page-title-box h4 { font-size: 20px !important; font-weight: 500; text-transform: none; color: var(--g-title); }

/* ---------- KPI cards (dashboard) ---------- */
.kpi-card { position: relative; overflow: hidden; background: var(--g-primary-light); color: #fff; border: 0; border-radius: var(--g-radius); min-height: 112px; cursor: pointer; transition: transform .1s, box-shadow .1s; display: block; }
.kpi-card:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 6px 14px rgba(var(--g-primary-rgb), .35); }
.kpi-card::before { content: ''; position: absolute; right: -60px; top: -40px; width: 220px; height: 260px; background: rgba(255, 255, 255, .06); transform: rotate(-40deg); }
.kpi-card .card-body { position: relative; padding: 14px 16px 12px; }
.kpi-card .kpi-title { text-transform: uppercase; font-size: 13px; font-weight: 500; line-height: 1.25; max-width: 70%; min-height: 32px; }
.kpi-card .kpi-value { font-size: 24px; font-weight: 500; margin: 4px 0 3px; line-height: 1.1; }
.kpi-card .kpi-icon { position: absolute; right: 16px; top: 12px; width: 48px; height: 48px; border-radius: 50%; background: rgba(255, 255, 255, .15); display: flex; align-items: center; justify-content: center; font-size: 24px; }
.kpi-card.active { box-shadow: inset 0 -3px 0 rgba(255, 255, 255, .8); }

/* ---------- toggles filter bar ---------- */
.filter-card .form-switch { padding-left: 2.7em; margin-bottom: 0; min-height: 1.6rem; }
.filter-card .form-switch .form-check-input { width: 2.2em; height: 1.15em; margin-left: -2.7em; cursor: pointer; }
.filter-card .form-check-label { cursor: pointer; font-size: 13.5px; color: #495057; }
.search-pill { background: #f3f3f9; border: 0; border-radius: 30px; padding-left: 36px; padding-right: 36px; height: 36px; }
.search-pill-wrap { position: relative; }
.search-pill-wrap .bx-x { position: absolute; left: 12px; top: 9px; font-size: 18px; color: #74788d; cursor: pointer; }
.search-pill-wrap .bx-search { position: absolute; right: 13px; top: 9px; font-size: 17px; color: #74788d; }

/* ---------- tables: dense ---------- */
.table-gmao { margin-bottom: 0; }
.table-gmao > :not(caption) > * > * { padding: .55rem .6rem; vertical-align: middle; }
.table-gmao thead th { font-weight: 600; color: #495057; border-bottom-width: 1px; white-space: nowrap; font-size: 13px; }
.table-gmao thead th a { color: inherit; }
.table-gmao tbody td { color: #495057; }
.table-gmao td.text-truncate-cell { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.table-gmao tr.row-link { cursor: pointer; }
.table-gmao tr.row-link:hover td { background: var(--g-hover); }
.btn-action { width: 30px; height: 30px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.badge { font-weight: 500; }
.card { margin-bottom: 20px; border-radius: var(--g-radius); }
.card-title { font-size: 15px; font-weight: 500; color: #495057; }
.pagination-sm .page-link { padding: .25rem .55rem; }

/* ---------- forms: label left, as the existing ticket form ---------- */
.form-row-g { display: flex; align-items: flex-start; margin-bottom: 12px; }
.form-row-g > label { flex: 0 0 150px; padding-top: 7px; font-weight: 500; color: #495057; margin: 0; }
.form-row-g > .fld { flex: 1 1 auto; min-width: 0; }
@media (max-width: 575px) { .form-row-g { display: block; } .form-row-g > label { padding-top: 0; margin-bottom: 4px; } }
.form-control[readonly], .form-control:disabled { background-color: #eff2f7; }
.form-control.is-required-empty, .select2-container.is-required-empty .select2-selection { border-color: #f46a6a !important; }
.select2-container--default .select2-selection--single { height: 36.5px; border-color: #ced4da; }
.select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 35px; padding-left: .75rem; color: #495057; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 34px; }
.select2-container--default .select2-selection--multiple { border-color: #ced4da; min-height: 36.5px; }
.select2-dropdown { border-color: #ced4da; z-index: 1065; }
.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background-color: var(--g-primary); }
.select2-container { width: 100% !important; }
.modal .select2-container { z-index: 1060; }

/* ---------- modals ---------- */
.modal-header { padding: .8rem 1.25rem; }
.modal-title { font-size: 16px; font-weight: 500; }
.modal-body { padding: 1.1rem 1.25rem; }
.nav-type-switch .btn { min-width: 90px; }

/* ---------- detail pages ---------- */
.detail-label { color: #74788d; font-size: 12px; margin-bottom: 2px; }
.detail-value { color: #343a40; font-weight: 500; }
.dl-g { display: grid; grid-template-columns: 160px 1fr; gap: 8px 12px; margin: 0; }
.dl-g dt { font-weight: 500; color: #74788d; }
.dl-g dd { margin: 0; color: #343a40; word-break: break-word; }
.ref-pill { background: var(--g-soft); color: var(--g-primary-dark); padding: .35rem .7rem; border-radius: 4px; font-weight: 600; }

/* ---------- activity timeline (Dernières activités) ---------- */
.timeline-g { list-style: none; padding: 0; margin: 0; position: relative; }
.timeline-g::before { content: ''; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: var(--g-line); }
.timeline-g li { position: relative; padding-left: 30px; margin-bottom: 14px; }
.timeline-g li .tl-dot { position: absolute; left: 0; top: 12px; width: 16px; height: 8px; border-radius: 6px; background: #fff; border: 2px solid var(--g-primary); }
.timeline-g li .tl-box { background: #f6f6f9; border-radius: 4px; padding: .6rem .85rem; }
.timeline-g li .tl-head { color: #495057; }
.timeline-g li .tl-msg { margin-top: .4rem; color: #343a40; white-space: pre-wrap; }

/* ---------- map ---------- */
.map-g { height: 560px; border-radius: var(--g-radius); background: #eef0f3; }
.map-g.small { height: 330px; }
.map-g.no-tiles { background-color: #eef0f3; background-image: linear-gradient(#e2e5ea 1px, transparent 1px), linear-gradient(90deg, #e2e5ea 1px, transparent 1px); background-size: 40px 40px; }
.map-legend span { display: inline-flex; align-items: center; margin-right: 14px; font-size: 12px; color: #495057; }
.map-legend i { width: 11px; height: 11px; border-radius: 50%; display: inline-block; margin-right: 5px; }

/* ---------- signature ---------- */
.signature-pad { border: 1px dashed var(--g-dashed); border-radius: 4px; background: #fff; width: 100%; height: 160px; touch-action: none; cursor: crosshair; }

/* ---------- toasts ---------- */
.toast-zone { position: fixed; top: 80px; right: 20px; z-index: 2000; }
.toast-zone .toast { min-width: 280px; }

/* ---------- planning ---------- */
.fc { font-size: 12.5px; }
.fc .fc-button-primary { background: var(--g-primary); border-color: var(--g-primary); }
.fc .fc-button-primary:not(:disabled).fc-button-active, .fc .fc-button-primary:not(:disabled):active { background: var(--g-primary-dark); border-color: var(--g-primary-dark); }
.fc .fc-toolbar-title { font-size: 17px; font-weight: 500; }
.fc-event { cursor: pointer; }

/* ---------- admin sub menu ---------- */
.admin-nav .nav-link { color: #495057; padding: .45rem .9rem; font-weight: 500; }
.admin-nav .nav-link.active { background: var(--g-primary); color: #fff; }

/* ---------- login ---------- */
.auth-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--g-auth-bg); padding: 20px; }
.auth-card { width: 100%; max-width: 470px; background: #fff; border-radius: var(--g-auth-radius); box-shadow: 0 4px 24px rgba(0, 0, 0, .06); padding: 40px 38px 46px; }
.auth-card h4 { text-align: center; color: #495057; font-weight: 500; margin: 14px 0 26px; font-size: 19px; }
.auth-logo { text-align: center; font-size: 42px; color: var(--g-primary); line-height: 1; }
.auth-logo img { max-height: 64px; max-width: 220px; }

.text-pre { white-space: pre-wrap; }
.min-w-0 { min-width: 0; }
.cursor-pointer { cursor: pointer; }

/* ---------- look-and-feel preview (super administration > project > Affichage) ---------- */
.lf-preview { display: flex; height: 210px; border: 1px solid #e2e5ea; border-radius: 4px; overflow: hidden; font-size: 10px; }
.lf-side { flex: 0 0 120px; display: flex; flex-direction: column; }
.lf-brand { color: #fff; font-weight: 500; font-size: 12px; padding: 12px 10px 10px; }
.lf-item { padding: 5px 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lf-item i { margin-right: 5px; }
.lf-item.active { color: #fff; background: rgba(255, 255, 255, .06); }
.lf-user { margin-top: auto; color: #fff; text-align: center; padding: 8px 4px; font-weight: 600; }
.lf-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.lf-top { height: 38px; background: #fff; display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 0 10px; box-shadow: 0 1px 2px rgba(0, 0, 0, .04); color: #555b6d; }
.lf-avatar { width: 26px; height: 26px; font-size: 9px; }
.lf-body { padding: 10px 12px; }
.lf-title { font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.lf-kpis { display: flex; gap: 8px; margin-bottom: 8px; }
.lf-kpi { flex: 1 1 0; color: #fff; padding: 7px 8px; min-height: 52px; text-transform: uppercase; font-size: 8.5px; font-weight: 500; line-height: 1.2; }
.lf-kpi b { display: block; font-size: 15px; font-weight: 500; margin-top: 4px; }
.lf-card { background: #fff; padding: 9px 10px; display: flex; justify-content: space-between; align-items: center; font-weight: 500; color: #495057; }
.lf-btn { color: #fff; padding: 3px 9px; border-radius: 3px; font-weight: 400; }

/* ---------- platform logos (super administration > Paramètres de la plateforme) ---------- */
.logo-current { display: inline-block; padding: 8px 12px; border: 1px solid #e2e5ea; border-radius: 4px; background: #fff; }
.logo-current.dark { background: var(--g-sidebar); border-color: var(--g-sidebar); }
.logo-current img { max-height: 48px; max-width: 220px; display: block; }
