/* E-Complex LemonCake Makeover Compatibility Layer
   Purpose: remove Bootstrap CSS dependency while keeping legacy PHP pages working. */

/* LemonCake app shell helpers */



.document {
    padding: calc(var(--topbar-h) + 16px) 12px 12px;
}
.pageHeader + .document {
    max-width: 1280px;
    margin: 0 auto;
}
.ecomplex-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 210px;
    gap: 12px;
    align-items: start;
}

.ecomplex-main {
    min-width: 0;
    width: 100%;
}

.ecomplex-side {
    width: 210px;
}
.ecomplex-logo {
    max-width: 150px;
    max-height: 150px;
    object-fit: contain;
}
/* grid replacement */



    .document {
        padding-top: 12px;
    }

/* navbar replacement */
.navbar {
    min-height: var(--topbar-h);
    height: auto;
    margin: 0;
    border: 0;
    border-bottom: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--pad);
    position: sticky;
    top: 0;
    z-index: 20;
}
.navbar-fixed-top {
    position: sticky;
    top: 0;
}
.navbar .container-fluid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 10px;
}
.navbar-header {
    display: flex;
    align-items: center;
}
.navbar-brand {
    font-weight: 900;
    font-size: 14px;
    padding: 0 10px;
    min-height: var(--topbar-h);
    display: inline-flex;
    align-items: center;
    color: var(--primary) !important;
}
.navbar-toggle {
    display: none;
    background: transparent;
    border: 1px solid var(--border);
    padding: 7px;
    border-radius: var(--radius-lg);
}
.icon-bar {
    display: block;
    width: 18px;
    height: 2px;
    background: var(--primary);
    margin: 3px 0;
}
.navbar-collapse {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex: 1;
}
.nav {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
}
.nav > li {
    position: relative;
}
.nav > li > a {
    display: inline-flex;
    align-items: center;
    min-height: var(--topbar-h);
    padding: 0 9px;
    border-radius: var(--radius-lg);
    color: var(--muted);
    font-weight: 700;
}
.nav > li > a:hover {
    background: var(--surface-2);
    color: var(--text);
}
.navbar-right {
    margin-left: auto;
}
.badge {
    display: inline-block;
    min-width: 18px;
    padding: 3px 5px;
    border-radius: 999px;
    background: var(--primary);
    color: #fff;
    font-size: 11px;
    line-height: 1;
    text-align: center;
}
@media (max-width: 850px) {
    .navbar,
    .navbar .container-fluid,
    .navbar-collapse,
    .nav {
        display: block !important;
    }
    .navbar-toggle {
        display: inline-block;
    }
    .navbar-collapse.collapse {
        display: none !important;
    }
    .navbar-collapse.collapse.in,
    .navbar-collapse.is-open {
        display: block !important;
    }
    .nav > li > a {
        min-height: 34px;
        width: 100%;
    }
}


.table-responsive {
    width: 100%;
    overflow: auto;
    border: 1px solid var(--border);
    background: #fff;
}
table {
    border-collapse: collapse;
    width: 100%;
}
th,
td {
    padding: 7px 9px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}
th {
    font-size: 12px;
    text-transform: none;
    color: var(--muted);
    background: #fafafa;
    font-weight: 900;
}
/* custom modal with Bootstrap-compatible classes */
body.modal-open {
    overflow: hidden;
}
.modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(17, 24, 39, 0.48);
    padding: 28px 12px;
    overflow: auto;
}
.modal.is-open,
.modal.in {
    display: block;
}
.modal-dialog {
    max-width: 680px;
    margin: 0 auto;
}
.modal-content {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 10px;
    box-shadow: var(--shadow);
    overflow: hidden;
}
.modal-header,
.modal-footer {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.modal-footer {
    border-top: 1px solid var(--border);
    border-bottom: 0;
    justify-content: flex-end;
}
.modal-title {
    margin: 0;
    font-size: 15px;
    font-weight: 900;
}
.modal-body {
    padding: 12px;
}
.close {
    border: 0;
    background: transparent;
    font-size: 20px;
    height: auto;
    padding: 0 4px;
    color: var(--muted);
    cursor: pointer;
}
.fade {
    transition: opacity 0.15s linear;
}
.alert {
    padding: 9px 11px;
    border-radius: 0;
    border: 1px solid var(--border);
    margin-bottom: 10px;
}
.alert-danger {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}
.alert-success {
    background: #f0fdf4;
    border-color: #bbf7d0;
    color: #166534;
}
/* Lemon login */


.login-title {
    font-size: 18px;
    font-weight: 900;
    color: var(--primary);
    margin: 0 0 5px;
}
.login-subtitle {
    color: var(--muted);
    font-size: 12px;
    margin: 0 0 15px;
}
.pull-left {
    float: left;
}
.pull-right {
    float: right;
}
.clearfix:after {
    content: "";
    display: block;
    clear: both;
}
.lc-dashboard-layout{
    min-height:100vh;
    display:grid;
    grid-template-columns:280px minmax(0,1fr);
    background:#f6f1ea;
}

.lc-sidebar-brand{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
    color:#553622;
}
.lc-sidebar-brand img{
    width:46px;
    height:46px;
    object-fit:contain;
    border-radius:14px;
    background:#fff;
    padding:4px;
    box-shadow:0 8px 22px rgba(80,54,38,.12);
}
.lc-sidebar-brand strong{
    font-size:20px;
    display:block;
    line-height:1.1;
}
.lc-sidebar-brand span{
    font-size:12px;
    color:#9a7151;
}
.lc-sidebar-user{
    background:#fff;
    border:1px solid rgba(80,54,38,.12);
    border-radius:18px;
    padding:14px;
    margin-bottom:18px;
    color:#553622;
}
.lc-sidebar-user small{
    display:block;
    color:#9a7151;
    text-transform:uppercase;
    letter-spacing:.08em;
    font-size:10px;
    margin-bottom:4px;
}
.lc-sidebar-nav,.lc-sidebar-actions{
    list-style:none;
    margin:0;
    padding:0;
}
.lc-sidebar-nav li,.lc-sidebar-actions li{
    margin:7px 0;
}
.lc-sidebar-nav a,.lc-sidebar-actions a{
    display:flex;
    align-items:center;
    gap:10px;
    padding:11px 12px;
    border-radius:14px;
    color:#5d4030;
    background:transparent;
    border:1px solid transparent;
    transition:all .18s ease;
    font-weight:600;
}
.lc-sidebar-nav a:hover,.lc-sidebar-actions a:hover{
    background:#fff;
    border-color:rgba(80,54,38,.13);
    box-shadow:0 8px 18px rgba(80,54,38,.08);
    transform:translateX(2px);
}
.lc-sidebar-nav strong,.lc-sidebar-actions strong{
    color:inherit!important;
}
.lc-sidebar-divider{
    height:1px;
    background:rgba(80,54,38,.12);
    margin:16px 0;
}
.lc-sidebar-actions .badge{
    margin-left:auto;
    background:#d8894c;
    color:#fff;
    border-radius:999px;
    padding:3px 7px;
    font-size:11px;
}
.lc-dashboard-main{
    min-width:0;
}
.lc-mobile-topbar{
    display:none;
    position:sticky;
    top:0;
    background:#fffaf3;
    border-bottom:1px solid rgba(80,54,38,.14);
    padding:10px 14px;
    z-index:60;
}
.lc-sidebar-toggle{
    border:0;
    border-radius:12px;
    background:#d8894c;
    color:#fff;
    padding:9px 12px;
    font-weight:700;
}
.lc-sidebar-overlay{
    display:none;
}
body.lc-sidebar-open{
    overflow:hidden;
}
@media(max-width:900px){
    .lc-dashboard-layout{
        display:block
    }
    .lc-mobile-topbar{
        display:flex;
        align-items:center;
        justify-content:space-between
    }
    .lc-sidebar{
        position:fixed;
        left:-300px;
        top:0;
        width:280px;
        transition:left .2s ease
    }
    .lc-sidebar-open .lc-sidebar{
        left:0
    }
    .lc-sidebar-overlay{
        position:fixed;
        inset:0;
        background:rgba(45,30,20,.42);
        z-index:40
    }
    .lc-sidebar-open .lc-sidebar-overlay{
        display:block
    }
    .document{
        padding-top:14px!important
    }
}