/************************************************************************************************************************
	layout.css: Unified structural layout for all sites.  It is divided into the following sections:	
		* Page Layout: the global element element blocks that compose all page structures (logged/public)
		* mainContent: Global styles for all content pages, including the toolbar and the pagecontent
		* Icons: CSS-controlled images used as icons

		Copyright (c) 2012-Present - agileKaizen, Ltd., all rights reserved. http://agileKaizen.com

 ************************************************************************************************************************/

/* ============================== BASE STRUCTURE ============================== */
html {height:100%;}
body {height:100%; width:100%;}
body.unauthenticated {padding-top:4rem;}


/* ============================== RANDOM ============================== */
.poweredBy {position:relative; right:.5rem; font-size:11px;}
.footer {font-size:0.9rem;}
.navbar-footer {font-size:12px;}
.dock {position:absolute; top:0; bottom:0; left:0; right:0;}
.btn-close {float:right;}


/* ============================== DRAWER ============================== */
.drawer {position:fixed; left:-240px; width:240px; top:0; bottom:0; z-index:var(--z-drawer); transition:var(--transition-normal);}
.dock.open .drawer {transform:translate3d(100%,0,0);}
.drawer-header {height:0;}
.drawer-header .context-title {position:absolute; display:flex; flex-direction:column; align-items:center; justify-content:center; left:58px; width:124px; height:55px; text-align:center; vertical-align:middle; cursor:pointer;}
.drawer-body {position:absolute; top:60px; bottom:0; padding-bottom:0; overflow-y:auto; overflow-x:hidden; width:100%;}
.drawer-subHeader + .drawer-body, .drawer-subHeader + div .drawer-body {top:100px;}
.drawer-logo {height:60px; margin-left:1.15rem;}
.drawer-toggle {position:fixed; top:2px; left:5px; padding:1rem .5rem; z-index:1021;}
.drawer-toggle i {font-size:24px; font-weight:bolder; color:rgba(35,55,82,1);}
.dock.open .drawer-toggle {left:190px;}
.dock.open .drawer-toggle i {color:rgba(255,255,255,0.5);}


/* ============================== CONTEXT MENU ============================== */
/* Main navigational menu */
.nav .navbar {height:40px;}
.context-menu {display:flex; position:fixed; left:0; right:0; bottom:0; height:40px; width:100%; z-index:1030; align-self:center; justify-content:center; font-family:var(--font-cereal); transition:all .35s ease; background-color:var(--bs-body-bg) !important;}
	.context-menu .navbar-nav {display:flex; flex-direction:row; justify-content:center; align-items:center;}
	.context-menu .navbar-nav .menuSelector {display:flex; flex-direction:column; align-items:center; margin:0 1.25rem; cursor:pointer; color:var(--text-muted); font-weight:var(--font-weight-heavy); text-decoration:none;}
	.context-menu .navbar-nav .menuSelector .item-icon {font-size:18px;}
	.context-menu .navbar-nav .menuSelector .item-name {font-size:11px;}
	.context-menu .navbar-nav .menuSelector:hover, .context-menu .navbar-nav .subMenuSelector:hover {text-shadow:0px 0px 1rem; color:var(--bs-gray-700);}
	.context-menu .navbar-nav .menuSelector:hover .item-icon, .context-menu .navbar-nav .subMenuSelector:hover .item-icon {opacity:.75}
	.context-menu .navbar-nav .menuSelector.active .item-icon, .context-menu .navbar-nav .menuSelector.active .item-name {color:var(--brand-primary); text-shadow:0px 0px 2px rgba(var(--brand-primary-rgb),.75);}
	.context-menu .navbar-nav .menuSelector.active .item-icon {opacity:1;}
	

/* ============================== PANELS ============================== */
.subNav, .centerPanel, .rightPanel, .alert {transition:var(--transition-slow);}
.mainContent {display:flex; flex-direction:column; flex-grow:1; top:55px;}
.breadcrumb {padding:0; margin-bottom:1rem; background-color:transparent;}
.breadcrumb-item + .breadcrumb-item::before {content:">"; font-weight:600;}
.breadcrumb-item {font-weight:600;}
.breadcrumb-item.active {font-weight:400;}

.centerPanel {flex:1 0 auto; margin-top:65px;}
.contentPanel {border:1px solid var(--bs-gray-300); margin-bottom:1.5rem; border-radius:var(--radius-md); background:var(--brand-surface);}


/* ============================== PAGE STRUCTURE ============================== */
/* Generic layout wrappers and fixed footer helpers */
.content-wrapper {display:flex; flex-direction:column; min-height:100vh; background-color:var(--brand-background);}
.page-section {padding:2rem 0;}
.view-header {padding:1rem 2rem; border-bottom:1px solid var(--bs-border-color);}
.view-body {flex:1; padding:2rem;}
.footer-fixed {position:fixed; bottom:0; left:0; width:100%; background-color:var(--brand-surface); border-top:1px solid var(--bs-border-color);}


/* ============================== TOOLBARS (NAVs) ============================== */
/* bubble-menu */		
.bubble-menu {margin-bottom:1.5rem;}
	.bubble-menu .nav-link.nav-badge {padding:.5rem 1rem; border-radius:1rem; white-space:nowrap; background-color:var(--bs-gray-300); color:var(--text-body);}
	.bubble-menu .nav-link.nav-badge:hover {background-color:var(--bs-gray-400);}
	.bubble-menu .nav-link.nav-icon.dropdown-toggle:hover {background-color:var(--bs-gray-300) !important;}
	.bubble-menu .nav-link.nav-icon.dropdown-toggle:active:hover {background-color:var(--brand-primary) !important; color:var(--text-inverse);}
	.bubble-menu .nav-link.nav-badge.active {background-color:var(--brand-primary); color:var(--text-inverse);}

/* entity-toolbar */
.entity-toolbar {display:flex; align-items:center; justify-content:space-between; width:100%; padding:1rem 0rem; min-height:48px;}
	.entity-toolbar .nav-pills {display:flex; flex-wrap:nowrap; align-items:center; width:100%; gap:.5rem; }
	.entity-toolbar .nav-item {display:flex; align-items:center;}
	.entity-toolbar .nav-link {min-height:40px;}
	.entity-toolbar .btn {padding:.5rem .75rem; font-weight:500;}
	.entity-toolbar .btn-link {border:none;}
	.entity-toolbar .btn.active {font-weight:600;}

/* nav-icon */
.nav-link.nav-icon {font-size:1.5rem; color:var(--bs-gray-600);}
	.nav-link.nav-icon:hover {background-color:var(--bs-gray-400);}
	.nav-link.nav-icon.dropdown-toggle {background-color:var(--brand-background);}
	.nav-link.nav-icon.dropdown-toggle:hover {background-color:rgba(var(--brand-contrast-rgb),.5); color:var(--brand-primary);}
	.nav-link.nav-icon.dropdown-toggle:active {background-color:var(--brand-primary-dark);}
	.nav-link.nav-icon.dropdown-toggle::after, .btn.nav-icon.dropdown-toggle::after {display:none !important; content:none !important;}

/* Nav Filter */
.nav-item.nav-filter .input-group {min-height:40px;}
.nav-item.nav-filter input.form-control {background-color:var(--brand-surface); width:5rem; transition:width 0.5s ease;}
	.nav-item.nav-filter input.form-control:hover {width:7.5rem;}
	.nav-item.nav-filter input.form-control:focus {border-color:var(--brand-outline); width:9rem;}
	
/* Nav tabs line */
.nav-tabs-line {border-bottom:1px solid var(--bs-border-color); margin-bottom:1rem;}
	.nav-tabs-line .nav-link {border:none; border-bottom:2px solid transparent; margin-bottom:-1px; color:var(--text-body); font-weight:500;}
	.nav-tabs-line .nav-link.active,.nav-tabs-line .nav-link.active:hover {border-bottom:2px solid var(--brand-primary); color:var(--brand-primary-dark);}

/* Nav tabs subNav */	
.nav-tabs-subNav {border-bottom:1px solid var(--bs-border-color); background-color:var(--brand-surface);}
	.nav-tabs-subNav .nav-link {padding:.5rem 1rem; color:var(--text-muted);}
	.nav-tabs-subNav .nav-link.active {color:var(--brand-primary); font-weight:600;}

/* Responsive Tabs Mode */
.entity-toolbar.tabs-responsive {display:flex; overflow-x:auto !important; justify-content:space-between; align-items:flex-end; padding-bottom:0; margin-bottom:1rem; border-bottom:1px solid var(--bs-border-color);}
	.entity-toolbar.tabs-responsive .nav {flex-wrap:nowrap;}
	.entity-toolbar.tabs-responsive .nav-tabs-line {padding-top:.5rem; border-bottom:none;}
	.entity-toolbar.tabs-responsive .nav-pills-right {margin-left:1rem;}

/* idCard */
.idCard {margin:0px; padding:0px; border-radius:10px; box-shadow:0px 4px 8px #CCC; border:1px solid #e5e5e5;}
	#idCard {width:345px;}
	.img-empty {font-size:29px}
	.idCard .card-footer {border-radius:0 0 10px 10px;}


/* ============================== MODALS ============================== */
.modal-primary .modal-header, .modal-primary .modal-body, .modal-primary .modal-footer {background:rgba(var(--color-primary),1) url(../../images/background/noise.png);}
.modal-primary button.btn-close, .modal-primary .modal-header {color:#fff !important;}


/* ============================== TYPOGRAPHIC COMPONENTS ============================== */
.section-title {font-size:1.4rem; font-weight:var(--font-weight-light); margin-bottom:1.5rem; text-align:center;}
.section-subtitle {font-weight:var(--font-weight-light); margin-top:-1.5rem; margin-bottom:1.5rem; text-align:center;}

.section-heading {font-size:0.75rem; font-weight:var(--font-weight-heavy); color:var(--text-muted); text-transform:uppercase; border-bottom:1px solid var(--bs-gray-300); width:100%; margin-bottom:.25rem; padding-left:.25rem;}
.section-heading-description {margin-top:-.25rem; padding-left:.25rem; font-size:0.75rem; color:var(--text-muted-light);}

.article-title {font-family:var(--font-skolar); font-size:2rem; font-weight:var(--font-weight-bold); line-height:2.25rem; margin-bottom:.25rem;}
.post-preview .article-title {font-size:1.75rem; font-weight:var(--font-weight-semibold); line-height:2rem; margin-bottom:0;}
.article-subtitle {font-size:1rem; line-height:1.5rem; margin-bottom:.5rem;}
.post-preview .article-subtitle {font-size:.9rem; line-height:1.25rem; margin-bottom:.25rem;}
h2.favorites {padding:10px 0; color:var(--bs-gray-500); text-transform:uppercase; letter-spacing:2pt; border-bottom:1px solid var(--bs-gray-300); border-top:1px solid var(--bs-gray-300); font-size:1.2rem;}

/* ============================== CONTENT BODY ============================== */
.content-body,.kb-body {font-family:var(--font-tiempos); font-size:1.05rem; line-height:1.8;}
.content-body p,.kb-body p {margin-bottom:1.75rem;}
.content-body a,.kb-body a {text-decoration:underline; color:var(--bs-link-color);}
.content-body a:hover,.kb-body a:hover {color:var(--bs-link-hover-color);}

/* Reader Mode Variant */
.content-body.readerMode h1:first-of-type {font-size:1.6rem !important; padding:1.25rem; margin:1.25rem 0; background-color:var(--bs-info-bg-subtle); margin-bottom:0 !important; border-left:0.25rem solid var(--brand-primary); border-top-right-radius:10px;}
.content-body.readerMode h1:first-of-type + p:first-of-type {padding:1.25rem; padding-top:0; background-color:var(--bs-info-bg-subtle); margin-top:0 !important; border-left:0.25rem solid var(--brand-primary); border-bottom-right-radius:10px;}
.content-body.readerMode h1:first-of-type:not(:has(+ p)) {border-bottom-right-radius:10px;}


/* ============================== APP ============================== */
/* PAC: PROPELIER ACTION CONTAINER */
.container-pac {margin-bottom:2rem;}
.container-pac-heading {display:flex; align-items:baseline; justify-content:space-between; gap:0.75rem; padding:0 0.75rem; margin:0 0 0.35rem 0;}
.container-pac-title {font-size:0.7rem; font-weight:var(--font-weight-heavy); color:var(--text-muted-light); text-transform:uppercase; letter-spacing:0.04em; line-height:1.1; text-shadow:0 0 1px var(--bs-border-color); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.container-pac-meta {display:flex; align-items:center; gap:0.5rem; flex:0 0 auto; white-space:nowrap;}
.container-pac-link {font-size:0.7rem; color:var(--text-muted); text-decoration:none;}
.container-pac-link:hover {color:var(--bs-link-color); text-decoration:underline;}
.container-pac-badge {font-size:0.68rem; padding:0.1rem 0.4rem; border:1px solid var(--bs-border-color); border-radius:999px; color:var(--text-muted); background:var(--brand-surface);}

.card-pac {background-color:var(--brand-surface); border:1px solid var(--brand-border); border-radius:var(--bs-border-radius); box-shadow:0 1px 3px rgba(var(--bs-black-rgb),0.06); padding:.25rem; transition:box-shadow .15s ease-in-out, border-color .15s ease-in-out;}
.card-pac:hover, .card-pac:focus-within {box-shadow:0 4px 12px rgba(var(--bs-black-rgb),0.08); border-top-color:var(--bs-gray-400); border-right-color:var(--bs-gray-400); border-bottom-color:var(--bs-gray-400);}
.card-pac.compact {padding:.75rem 1rem; border-radius:var(--bs-border-radius-lg); box-shadow:0 1px 4px rgba(var(--bs-black-rgb),0.04);}

.card-pac .card-header {display:flex; align-items:center; gap:.5rem; background-color:transparent; border-color:var(--brand-outline); padding:.25rem 1rem; min-height:2rem;}
.card-pac .card-header-left {display:flex; align-items:center; gap:.5rem; min-width:0; font-size:0.7rem; font-weight:var(--font-weight-heavy); color:var(--text-muted-light); text-transform:uppercase; letter-spacing:0.04em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.card-pac .card-header-right {display:flex; margin-left:auto; align-items:center; gap:0.5rem; flex:0 0 auto; white-space:nowrap;}
.card-pac .card-header-link {font-size:0.7rem; color:var(--text-muted); text-decoration:none;}
.card-pac .card-header-link:hover {color:var(--bs-link-color); text-decoration:underline;}

.card-pac .card-body {padding:0.75rem 1rem;}
.card-pac .card-footer {display:flex; flex-direction:row-reverse; justify-content:space-between; background-color:transparent; border:none; border-radius:var(--bs-border-radius); padding:0rem 1rem .75rem 1rem;}

/* BEHAVIOR ACCENT SYSTEM (MAPPED TO PALETTE VARIABLES) */
.pac-cue {border-left:3px solid rgba(var(--bs-info-rgb),1);}      /* Orientation / Focus */
.pac-action {border-left:3px solid rgba(var(--bs-success-rgb),1);} /* Practice / Activation */
.pac-reward {border-left:3px solid rgba(var(--bs-warning-rgb),1);} /* Reflection / Insight */
.pac-loop {border-left:3px solid rgba(var(--bs-indigo-rgb),1);}    /* Recall / Integration */

.bg-cue-delicate {background-color:rgba(var(--bs-info-rgb),.15) !important;}
.bg-action-delicate {background-color:rgba(var(--bs-success-rgb),.15) !important;}
.bg-reward-delicate {background-color:rgba(var(--bs-warning-rgb),.15) !important;}
.bg-loop-delicate {background-color:rgba(var(--bs-indigo-rgb),.15) !important;}

/* PAC Boxes */
.pac-box {position:relative; border:1px solid var(--bs-border-color); border-radius:var(--bs-border-radius); box-shadow:none; padding:0.75rem 1.5rem; margin-bottom:1rem; transition:box-shadow .15s ease-in-out, border-color .15s ease-in-out;}
.pac-box-heading {font-size:0.7rem; font-weight:var(--font-weight-heavy); color:var(--text-muted); text-transform:uppercase; margin-top:-0.25rem; margin-bottom:0.5rem;}
.card-pac-heading {font-size:0.7rem; font-weight:var(--font-weight-heavy); color:var(--text-muted-light); text-transform:uppercase; text-shadow:0 0 1px var(--bs-border-color); margin:0 0 0.25rem 0.75rem;}
.pac-list-heading {font-size:0.7rem; font-weight:var(--font-weight-heavy); color:var(--text-muted); text-transform:uppercase;} 
 
 /* =========================== RIGHT PANELS =========================== */
.rightPanel {position:fixed; top:0; bottom:0; right:0; width:100%; background-color:var(--brand-surface); border-left:1px solid var(--bs-border-color); z-index:1040; transform:translateX(100%); box-shadow:-2px 0 8px rgba(0,0,0,.05); transition:transform .3s ease, var(--transition-slow);}
.rightPanel.hidden {transform:translateX(100%);}
.rightPanel.visible, .mainPanel.open .rightPanel, .rightPanel.open {transform:translateX(0); box-shadow:-8px 0 10px rgba(18,28,41,0.25);}

.rightPanel-header {padding:1rem; background-color:var(--brand-surface); border-bottom:1px solid var(--bs-border-color); font-weight:600; color:var(--text-body);}
	.rightPanel .entity-toolbar {padding:1rem;}
.rightPanel-body {position:fixed; top:4.5rem; bottom:66px; overflow-y:auto; overflow-x:hidden; width:100%; padding:1rem;}
.rightPanel-footer {position:absolute; display:flex; justify-content:space-between; flex-direction:row-reverse; align-items:center; bottom:0; height:66px; width:100%; white-space:nowrap;}
	.rightPanel-footer .entity-toolbar {align-self:flex-end; padding:.5rem 1rem;}
	.rightPanel-footer .entity-toolbar .nav {flex-direction:row-reverse;}

.rightPanel-body .card-pac {margin-bottom:2rem; border:1px solid var(--brand-outline);}
.rightPanel-body .card-pac .card-body {padding:0.25rem 1rem;}
.rightPanel-body .card-pac .card-footer {padding:0.25rem 1rem;}
 

/* ============================== MEDIA QUERIES ============================== */

/* DEFAULT: EXTRA SMALL AND SMALL DEVICES */
@media (max-width:575px) {
	.content {padding:4rem 0;}  .content-sm {padding:2rem 0;}	.content-lg {padding:6rem 0;}	.content-xs {padding:1rem 0;}
	.rightPanel {width:100%;}
}

/* SM: SMALL AND UP */
@media (min-width:576px) {
	.content {padding:4rem 0;} .content-sm {padding:2rem 0;}	.content-lg {padding:6rem 0;}	.content-xs {padding:1rem 0;}
	.dock.open .mainPanel.open .form-elegant .col-form-label {text-align:left;}
}

/* MD: MEDIUM AND UP [768px] */
@media (min-width:768px) {
	.content {padding:5rem 0;} .content-sm {padding:3rem 0;}	.content-lg {padding:7rem 0;}	.content-xs {padding:1.5rem 0;}
	.drawer {transition:var(--transition-slow);}
	.dock.open .mainPanel.open .form-elegant .col-form-label {text-align:right;}
	.rightPanel {width:720px;}
	.sidebar {position:sticky; top:0; overflow-y:auto; height:100%;}
	.entity-block {border-left:5px solid var(--bs-gray-300); margin-left:1rem;}
	.entity-toolbar .nav-link {padding:.5rem .75rem;}
}

/* XS + SM + MD (< LD) → BOTTOM DOCK */
@media (max-width: 991px) {	
	.context-menu {top:auto; bottom:0; height:46px; display:flex; justify-content:center; padding-top:6px; border-top:1px solid var(--bs-border-color); box-shadow:0 -2px 8px rgba(var(--bs-black-rgb),0.05);}
	.context-menu .navbar-nav {width:85%; justify-content:space-between;}
}

/* LG: LARGE AND UP */
@media (min-width: 992px) {
	.content {padding:6rem 0;} .content-sm {padding:4rem 0;}	.content-lg {padding:8rem 0;}	.content-xs {padding:2rem 0;}
	.rightPanel {width:992px;}
	.nav-pills-right {right:1rem;}
	.nav.nav-pills.nav-pills-right + .tabs-responsive {margin-right:3rem;}
	.entity-block {margin-left:2rem;}
	.entity-menu .nav-link.nav-icon {font-size:2rem; padding:.85rem 1.55rem;}
	.entity-menu .nav-link.nav-icon:hover, .entity-menu .nav-link.nav-icon.active {font-size:2.5rem; padding:.6rem 1.2rem;}

	.context-menu {position:relative; right:auto; bottom:auto; left:auto; border:none;}
	.context-menu .navbar-nav {justify-content:center;}	
	.context-menu .navbar-nav .menuSelector {flex-direction:row; margin:0 1rem;}
	.context-menu .navbar-nav .menuSelector .item-icon {font-size:20px;}
	.context-menu .navbar-nav .menuSelector .item-name {font-size:15px;}
}

/* XL: EXTRA LARGE AND UP */
@media (min-width: 1200px) {
	.content {padding:7rem 0;} .content-sm {padding:5rem 0;}	.content-lg {padding:9rem 0;}	.content-xs {padding:2.5rem 0;}
	.cover-background {min-height:535px;}
}

/* XXL: EXTRA-EXTRA LARGE AND UP */
@media (min-width:1400px) {
	.content {padding:8rem 0;} .content-sm {padding:6rem 0;}	.content-lg {padding:10rem 0;}	.content-xs {padding:3rem 0;}
}