/* ============================================================
   CMC eDMS — brand theme overrides for Mayan EDMS 4.11
   Loaded AFTER appearance/css/appearance.css (load order is what makes
   these overrides win — keep the <link> after that sheet in the shell
   template). Palette sampled from cmc-health.com + CMC logo files.
   ============================================================ */
:root{
  --cmc-navy:#212956;         /* logo text navy            */
  --cmc-blue:#1799E2;         /* logo roundel blue         */
  --cmc-green:#11C18B;        /* logo roundel green (logo art only; not used in CSS) */
  --cmc-primary-blue:#0066CC; /* site --primary-blue       */
  --cmc-dark-blue:#003D7A;    /* site --dark-blue          */
  --cmc-teal:#00A896;         /* site --accent-teal        */
  --cmc-teal-dark:#008C7A;    /* site teal hover           */
  --cmc-light-blue:#E8F4FF;   /* site --light-blue         */
}

/* ---------- Top navigation bar ----------
   Option 1 (white navbar). Bootswatch Flatly's own .navbar-default is
   calibrated for a DARK bar (white nav text, white toggle icon-bar, dark
   toggle hover) — every one of those needs an explicit light-bg override
   below, not just the background color itself. */
.navbar-default,.navbar-inverse,.navbar{
  background-color:#FFFFFF!important;
  background-image:none!important;
  border:none!important;
  border-bottom:3px solid var(--cmc-teal)!important;
}
.navbar-default .navbar-nav>li>a,
.navbar-default .navbar-text,
.navbar .navbar-nav>li>a{color:var(--cmc-dark-blue)!important;}
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>.active>a{
  color:var(--cmc-teal)!important;background-color:var(--cmc-light-blue)!important;}

/* Flatly's default toggle/hamburger is styled for a dark bar; invert it */
.navbar-default .navbar-toggle{border-color:var(--cmc-light-blue)!important;}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus{background-color:var(--cmc-light-blue)!important;}
.navbar-default .navbar-toggle .icon-bar{background-color:var(--cmc-dark-blue)!important;}

/* Brand logo image (replaces the "Mayan EDMS" text).
   Symmetric 13px/13px padding makes this box exactly 60px tall (13+34+13),
   the same as the navbar row itself — so it fills the row instead of
   sitting flush at the top with slack below it. Plain padding, still in
   normal document flow (unlike the earlier position:absolute attempt),
   so it can't collapse .navbar-header's width or overlap the search form. */
.navbar-brand{padding-top:13px;padding-bottom:13px;height:auto;}
img.cmc-navbar-logo{height:34px;width:auto;display:block;}

/* ---------- Left-hand (main) menu ----------
   Mayan/Flatly ship this dark by default (#2c3e50 panel + #1a242f/#517394
   active-hover states) — none of this existed in cmc.css before; it's a new
   override, not a re-color of something we already controlled. */
#menu-main{
  background-color:#FBFCFD!important;
  border-right:1px solid var(--cmc-light-blue)!important;
}
#menu-main-button-close{
  border-top:2px solid var(--cmc-light-blue)!important;
  border-bottom:2px solid var(--cmc-light-blue)!important;
}
#accordion-sidebar .panel-heading,
#accordion-sidebar .panel-heading a,
#accordion-sidebar>.panel>div>div>ul>li>a,
#accordion-sidebar>.panel>div>h4>a{
  background-color:#FBFCFD!important;
  color:var(--cmc-dark-blue)!important;
}
#accordion-sidebar .panel-heading:hover,
#accordion-sidebar a[aria-expanded="true"]{
  background-color:var(--cmc-light-blue)!important;
}
#accordion-sidebar>.panel>div>.panel-body>ul>li.active{
  background-color:var(--cmc-light-blue)!important;
  box-shadow:inset 3px 0 0 var(--cmc-teal);
}
#accordion-sidebar>.panel>div>.panel-body>ul>li:hover{
  background-color:var(--cmc-light-blue)!important;
}
#main-menu-footer{background:#FBFCFD!important;}
#main-menu-footer span{color:var(--cmc-dark-blue)!important;}

/* ---------- Links ---------- */
a,a:focus{color:var(--cmc-primary-blue);}
a:hover{color:var(--cmc-dark-blue);}

/* ---------- Primary action buttons ---------- */
.btn-primary{
  background-color:var(--cmc-teal)!important;
  border-color:var(--cmc-teal)!important;color:#fff!important;}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active,
.open>.dropdown-toggle.btn-primary{
  background-color:var(--cmc-teal-dark)!important;
  border-color:var(--cmc-teal-dark)!important;}
.btn-link{color:var(--cmc-primary-blue);}

/* ---------- Loading (Pace) bar ---------- */
.pace .pace-progress{background:var(--cmc-teal)!important;}

/* ---------- Active list / menu items ---------- */
.nav-pills>li.active>a,.nav-pills>li.active>a:hover{
  background-color:var(--cmc-primary-blue)!important;}
.list-group-item.active{
  background-color:var(--cmc-light-blue)!important;
  border-color:var(--cmc-light-blue)!important;color:var(--cmc-navy)!important;}
input[type=checkbox],input[type=radio]{accent-color:var(--cmc-primary-blue);}

/* ---------- Panels / labels ---------- */
.panel-primary>.panel-heading{
  background-color:var(--cmc-navy)!important;border-color:var(--cmc-navy)!important;}
.label-primary{background-color:var(--cmc-primary-blue);}

/* ---------- Login page ----------
   The login image is #authentication-login-image-top (an ID, specificity
   1,0,0). A plain img.cmc-login-logo rule (0,1,1) is outranked by the base
   ID rules, so cmc.css wouldn't actually control the login logo. The ID+class
   form below matches that specificity and wins — object-fit:contain keeps the
   portrait lockup whole instead of being cropped like the old banner. */
#authentication-login-image-top.cmc-login-logo,
img.cmc-login-logo{
  max-width:320px;width:auto;height:auto;
  object-fit:contain;background:none;
  margin:0 auto 18px;display:block;}
.form-control:focus{
  border-color:var(--cmc-blue);
  box-shadow:0 0 0 .15rem rgba(23,153,226,.25);}

/* ==== Document list layout — V5 (final) ====
   CLARIFICATION that ends the saga: the per-row "eye" actions column is NOT a
   CSS casualty. Mayan's DocumentListView hardcodes hide_links=True
   (documents/views/document_views.py get_extra_context), so the server never
   renders the Views/Actions column in the All-Documents list — by Mayan design.
   Per-document actions here are via the checkbox → bulk-actions toolbar, or by
   opening the document. Restoring the eye menu would require patching Mayan's
   view (out of scope). Therefore hiding columns 9–11 is SAFE (col 9 = empty
   Cabinets cell after the app-disable; 10–11 = vestigial empty headers, no body
   cells). We size the 8 real columns for the bilingual ID — EN | AR label.
   :has(td .label-tag) scopes to tagged document listings only. */
table.table:has(td .label-tag){ table-layout:fixed; width:100%; }

/* remove the empty Cabinets column + two vestigial empty trailing headers */
table.table:has(td .label-tag) th:nth-child(9),
table.table:has(td .label-tag) td:nth-child(9),
table.table:has(td .label-tag) th:nth-child(10),
table.table:has(td .label-tag) th:nth-child(11){ display:none; }

table.table:has(td .label-tag) th:nth-child(1){ width:3%;  } /* checkbox  */
table.table:has(td .label-tag) th:nth-child(2){ width:28%; } /* Label — bilingual ID — EN | AR */
table.table:has(td .label-tag) th:nth-child(3){ width:7%;  } /* Thumbnail */
table.table:has(td .label-tag) th:nth-child(4){ width:8%;  } /* Type      */
table.table:has(td .label-tag) th:nth-child(5){ width:3%;  } /* Pages     */
table.table:has(td .label-tag) th:nth-child(6){ width:10%; } /* Created   */
table.table:has(td .label-tag) th:nth-child(7){ width:25%; } /* Metadata  */
table.table:has(td .label-tag) th:nth-child(8){ width:16%; } /* Tags      */

table.table:has(td .label-tag) td,
table.table:has(td .label-tag) th{ white-space:normal; overflow-wrap:anywhere; vertical-align:top; }

/* Label: wrap at spaces; break mid-word only as a last resort */
table.table:has(td .label-tag) td:nth-child(2){ overflow-wrap:break-word; }

table.table:has(td .label-tag) .label-tag{ display:block; width:fit-content; margin:2px 0; font-size:11px; }