/* ==========================================================
   DIGITAL DIARY MANAGEMENT SYSTEM
   Version 1.0
========================================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;
}

/* ==========================================================
   DIGITAL DIARY MANAGEMENT SYSTEM
   VERSION 2.0
==========================================================*/

/*==============================
RESET
==============================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
}

/*==============================
BODY
==============================*/

body{

    background:#F1F5F9;

    color:#334155;

    overflow-x:hidden;

}

/*==============================
TOPBAR
==============================*/

.topbar{

    position:fixed;

    top:0;

    left:0;

    right:0;

    height:65px;

    background:#2563EB;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0 25px;

    color:#fff;

    z-index:999;

    box-shadow:0 4px 15px rgba(0,0,0,.15);

}

.top-left{

    display:flex;

    align-items:center;

    gap:15px;

}

.logo{

    font-size:28px;

    font-weight:700;

    letter-spacing:.5px;

}

.top-right{

    display:flex;

    align-items:center;

    gap:25px;

}

#clock{

    font-size:14px;

    font-weight:600;

}

.user-menu{

    font-weight:600;

}

.user-menu a{

    color:#fff;

    text-decoration:none;

}

.user-menu a:hover{

    text-decoration:underline;

}

.notification{

    position:relative;

    font-size:22px;

    cursor:pointer;

}

.notify-count{

    position:absolute;

    top:-8px;

    right:-8px;

    width:18px;

    height:18px;

    background:#EF4444;

    color:#fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:11px;

}

/*==============================
SIDEBAR
==============================*/

.sidebar{

    position:fixed;

    top:65px;

    left:0;

    width:260px;

    height:calc(100vh - 65px);

    background:#1E293B;

    overflow-y:auto;

    overflow-x:hidden;

    box-shadow:2px 0 10px rgba(0,0,0,.1);

}

.sidebar-title{

    padding:18px;

    text-align:center;

    color:#fff;

    font-size:22px;

    font-weight:bold;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.sidebar-menu{

    list-style:none;

}

.sidebar-menu li{

    border-bottom:1px solid rgba(255,255,255,.03);

}

.sidebar-menu li a{

    display:block;

    color:#E2E8F0;

    padding:13px 20px;

    text-decoration:none;

    transition:.25s;

}

.sidebar-menu li a:hover{

    background:#2563EB;

    color:#fff;

    padding-left:28px;

}

.sidebar-menu li.active a{

    background:#2563EB;

    color:#fff;

    border-left:5px solid #FACC15;

}

.menu-title{

    padding:12px 20px;

    background:#0F172A;

    color:#FACC15;

    font-size:11px;

    font-weight:bold;

    letter-spacing:1px;

}

.sidebar small{

    float:right;

    color:#CBD5E1;

}

/*==============================
CONTENT
==============================*/

.content{

    margin-left:260px;

    margin-top:65px;

    padding:25px;

    min-height:100vh;

    background:#F8FAFC;

}

/*==============================
CARD
==============================*/

.card{

    background:#fff;

    border-radius:12px;

    padding:22px;

    margin-bottom:25px;

    box-shadow:0 5px 15px rgba(0,0,0,.06);

    transition:.25s;

}

.card:hover{

    box-shadow:0 8px 22px rgba(0,0,0,.10);

}


/* ===========================
CARD
=========================== */

.card{

    background:#fff;

    border-radius:8px;

    padding:20px;

    box-shadow:0 2px 8px rgba(0,0,0,.08);

}
.page-header{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:20px;

padding-bottom:15px;

border-bottom:2px solid #eee;

}

.page-title{

font-size:30px;

font-weight:bold;

color:#1565C0;

}

.page-subtitle{

color:#777;

margin-top:5px;

}
.btn{

display:inline-block;

padding:10px 18px;

border-radius:6px;

text-decoration:none;

font-weight:bold;

cursor:pointer;

border:none;

}

.btn-save{

background:#198754;

color:white;

}

.btn-save:hover{

background:#157347;

}

.btn-back{

background:#6c757d;

color:white;

}

.btn-back:hover{

background:#565e64;

}

.btn-warning{

background:#ffc107;

color:black;

}

.btn-warning:hover{

background:#e0a800;

}

.btn-danger{

background:#dc3545;

color:white;

}

.btn-danger:hover{

background:#bb2d3b;

}
.search-box{

width:280px;

padding:10px;

border:1px solid #ccc;

border-radius:6px;

outline:none;

}

.search-box:focus{

border-color:#1565C0;

}
.table{

width:100%;

border-collapse:collapse;

margin-top:15px;

}

.table th{

background:#1565C0;

color:white;

padding:12px;

}

.table td{

padding:12px;

border:1px solid #ddd;

}

.table tbody tr:nth-child(even){

background:#fafafa;

}

.table tbody tr:hover{

background:#eef6ff;

}
.table{

width:100%;

border-collapse:collapse;

margin-top:15px;

}

.table th{

background:#1565C0;

color:white;

padding:12px;

}

.table td{

padding:12px;

border:1px solid #ddd;

}

.table tbody tr:nth-child(even){

background:#fafafa;

}

.table tbody tr:hover{

background:#eef6ff;

}
.alert-success{

background:#d4edda;

color:#155724;

padding:12px;

border-radius:5px;

margin-bottom:20px;

}

.alert-info{

background:#d1ecf1;

color:#0c5460;

padding:12px;

border-radius:5px;

margin-bottom:20px;

}

.alert-danger{

background:#f8d7da;

color:#721c24;

padding:12px;

border-radius:5px;

margin-bottom:20px;

}
.badge-secondary{
    background:#6c757d;
    color:#fff;
    padding:4px 10px;
    border-radius:20px;
}
.badge{
    padding:5px 10px;
    border-radius:20px;
    color:#fff;
    font-size:12px;
    font-weight:bold;
}

.badge-success{
    background:#28a745;
}

.badge-danger{
    background:#dc3545;
}
.doc-thumb{
    width:70px;
    height:50px;
    object-fit:cover;
    border:1px solid #ddd;
    border-radius:6px;
    cursor:pointer;
}
.btn-view{
    background:#0d6efd;
    color:#fff;
    padding:6px 10px;
    border-radius:5px;
    text-decoration:none;
}

.btn-edit{
    background:#ffc107;
    color:#000;
    padding:6px 10px;
    border-radius:5px;
    text-decoration:none;
}

.btn-delete{
    background:#dc3545;
    color:#fff;
    padding:6px 10px;
    border-radius:5px;
    text-decoration:none;
}
.badge{
    display:inline-block;
    padding:4px 10px;
    border-radius:20px;
    color:#fff;
    font-size:12px;
    font-weight:bold;
}

.badge-success{
    background:#28a745;
}

.badge-info{
    background:#17a2b8;
}

.badge-warning{
    background:#ffc107;
    color:#000;
}

.badge-danger{
    background:#dc3545;
}

.badge-secondary{
    background:#6c757d;
}

.sidebar{

width:260px;
background:#1f2937;
height:100vh;
overflow-y:auto;
position:fixed;
left:0;
top:60px;
padding-bottom:30px;

}

.sidebar-title{

color:#fff;
font-size:22px;
font-weight:bold;
text-align:center;
padding:20px;
border-bottom:1px solid #3b4b60;

}

.sidebar-menu{

list-style:none;
margin:0;
padding:0;

}

.sidebar-menu li{

margin:0;

}

.sidebar-menu li a{

display:block;
padding:12px 20px;
color:#fff;
text-decoration:none;
transition:.3s;

}

.sidebar-menu li a:hover{

background:#2563eb;
padding-left:28px;

}

.menu-title{

background:#111827;
color:#fbbf24;
font-size:12px;
font-weight:bold;
padding:10px 20px;
letter-spacing:1px;

}

.sidebar small{

color:#bfbfbf;
float:right;

}

.page-title{

font-size:28px;
font-weight:bold;
margin-bottom:20px;

}

.welcome-box{

background:#fff;
padding:20px;
border-radius:10px;
margin-bottom:20px;
box-shadow:0 2px 8px rgba(0,0,0,.1);

}

.dashboard-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;

}

.dashboard-card{

background:#fff;
padding:25px;
text-align:center;
border-radius:10px;
box-shadow:0 2px 8px rgba(0,0,0,.1);
transition:.3s;

}

.dashboard-card:hover{

transform:translateY(-5px);

}

.dashboard-card h3{

font-size:40px;
margin:0;

}

.dashboard-card h2{

font-size:32px;
margin:15px 0;

}

.dashboard-card p{

margin-bottom:15px;

}

.dashboard-card a{

background:#2563eb;
color:#fff;
padding:8px 18px;
border-radius:5px;
text-decoration:none;

}

.dashboard-card a:hover{

background:#1d4ed8;

}

.dashboard-row{

display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
margin-top:30px;

}

.dashboard-row ul{

padding-left:20px;

}

.dashboard-row li{

margin:10px 0;

}
.topbar{

height:60px;

background:#2563eb;

color:white;

display:flex;

justify-content:space-between;

align-items:center;

padding:0 20px;

position:fixed;

top:0;

left:0;

right:0;

z-index:999;

box-shadow:0 2px 10px rgba(0,0,0,.2);

}

.top-left{

display:flex;

align-items:center;

gap:15px;

}

.logo{

font-size:30px;

font-weight:bold;

}

#menu-toggle{

background:none;

border:none;

font-size:24px;

color:white;

cursor:pointer;

}

.top-right{

display:flex;

align-items:center;

gap:25px;

}

.notification{

position:relative;

font-size:22px;

cursor:pointer;

}

.notify-count{

position:absolute;

top:-8px;

right:-10px;

background:red;

color:white;

border-radius:50%;

padding:2px 6px;

font-size:11px;

}

.user-menu a{

color:white;

text-decoration:none;

font-weight:bold;

}
/*==================================
WELCOME CARD
==================================*/

.welcome-card{

display:flex;

justify-content:space-between;

align-items:center;

background:#fff;

padding:25px;

border-radius:12px;

margin-bottom:25px;

box-shadow:0 4px 12px rgba(0,0,0,.08);

}

.today-box{

text-align:right;

font-size:15px;

color:#666;

}

/*==================================
DASHBOARD CARDS
==================================*/

.dashboard-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

gap:20px;

margin-bottom:30px;

}

.dash-card{

border-radius:12px;

padding:25px;

color:#fff;

position:relative;

overflow:hidden;

transition:.3s;

}

.dash-card:hover{

transform:translateY(-6px);

}

.dash-card .icon{

font-size:42px;

margin-bottom:15px;

}

.dash-card .count{

font-size:36px;

font-weight:bold;

}

.dash-card .title{

margin-top:10px;

font-size:18px;

}

.dash-card a{

display:inline-block;

margin-top:20px;

color:#fff;

text-decoration:none;

font-weight:bold;

}

.blue{background:#2563EB;}

.green{background:#16A34A;}

.orange{background:#EA580C;}

.purple{background:#7C3AED;}

.red{background:#DC2626;}

.teal{background:#0F766E;}

/*==================================
BOTTOM GRID
==================================*/

.dashboard-two{

display:grid;

grid-template-columns:1fr 1fr;

gap:25px;

margin-bottom:25px;

}

/*=========================================
TOPBAR SEARCH
=========================================*/

.top-center{

    flex:1;

    display:flex;

    justify-content:center;

}

.search-wrapper{

    position:relative;

    width:420px;

}

.search-wrapper i{

    position:absolute;

    left:15px;

    top:13px;

    color:#666;

}

.search-wrapper input{

    width:100%;

    height:42px;

    border:none;

    outline:none;

    border-radius:25px;

    padding-left:42px;

    padding-right:20px;

    font-size:15px;

    background:#ffffff;

    box-shadow:0 2px 8px rgba(0,0,0,.15);

}

.search-wrapper input:focus{

    box-shadow:0 0 0 3px rgba(37,99,235,.25);

}

#searchResults{

    display:none;

    position:absolute;

    width:100%;

    background:#fff;

    border-radius:10px;

    margin-top:5px;

    box-shadow:0 8px 20px rgba(0,0,0,.15);

    z-index:9999;

    color:#1f2937;

    text-align:left;

    overflow:hidden;

}

/* Compact table action controls */
.table td .action-icon-button{
    width:36px;
    height:36px;
    min-width:36px;
    padding:0;
    margin:2px;
    border:0;
    border-radius:7px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    vertical-align:middle;
    line-height:1;
    text-decoration:none;
    cursor:pointer;
    box-shadow:0 1px 2px rgba(0,0,0,.12);
}

.table td .action-icon-button svg{
    width:18px;
    height:18px;
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
    pointer-events:none;
}

.table td form:has(.action-icon-button){
    display:inline-flex !important;
    vertical-align:middle;
    margin:0;
}

.table th:last-child,
.table td:last-child{
    white-space:nowrap;
}

.action-icon-button:focus-visible{
    outline:3px solid rgba(21,101,192,.3);
    outline-offset:2px;
}

.page-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:10px;
}

.page-actions .btn,
.page-actions [class^="btn-"],
.page-actions [class*=" btn-"]{
    margin:0;
    white-space:nowrap;
    width:auto;
    height:auto;
    min-width:max-content;
    flex:0 0 auto;
}

@media(max-width:768px){
    .finance-page-header{
        align-items:flex-start;
        flex-direction:column;
        gap:15px;
    }

    .page-actions{
        width:100%;
        justify-content:flex-start;
    }
}

.diary-filter{
    display:grid;
    grid-template-columns:minmax(220px,2fr) minmax(180px,1fr) auto;
    gap:14px;
    align-items:end;
    margin-bottom:20px;
    width:100%;
}

.diary-filter .form-group{
    min-width:0;
    margin:0;
}

.diary-filter-actions{
    display:flex;
    gap:10px;
    align-items:center;
}

.diary-filter-actions .btn{
    width:auto;
    min-width:82px;
    margin:0;
    white-space:nowrap;
    text-align:center;
}

@media(max-width:900px){
    .diary-filter{
        grid-template-columns:1fr 1fr;
    }

    .diary-filter-actions{
        grid-column:1/-1;
    }
}

@media(max-width:600px){
    .diary-filter{
        grid-template-columns:1fr;
    }

    .diary-filter-actions{
        grid-column:auto;
    }
}

.search-item{

    padding:12px 15px;

    cursor:pointer;

    border-bottom:1px solid #eee;

    color:#1f2937;

    background:#fff;

}

.search-item strong{

    color:#1d4ed8;

}

.search-item small{

    color:#64748b;

    margin-top:3px;

}

.search-item:last-child{

    border-bottom:none;

}

.search-item:hover{

    background:#f1f5f9;

}

.search-item:hover strong{

    color:#1e40af;

}

.dash-card{

cursor:pointer;

transition:.35s;

}

.dash-card:hover{

transform:translateY(-8px);

box-shadow:0 18px 35px rgba(0,0,0,.22);

}

.dashboard-two{

display:grid;

grid-template-columns:1fr 1fr;

gap:25px;

margin-top:25px;

}

.dashboard-two .card{

height:100%;

}

.dashboard-two table{

margin-top:10px;

}
.quick-actions{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

gap:15px;

margin-top:20px;

}

.quick-btn{

display:block;

padding:15px;

background:#2563eb;

color:#fff;

text-decoration:none;

border-radius:10px;

font-weight:600;

text-align:center;

transition:.3s;

}

.quick-btn:hover{

background:#1d4ed8;

transform:translateY(-4px);

color:#fff;

}

.badge-info{

background:#0ea5e9;

color:#fff;

padding:5px 10px;

border-radius:20px;

font-size:12px;

font-weight:600;

}/* ==========================================
   Dashboard Summary
========================================== */

.dashboard-summary{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

gap:20px;

margin-top:25px;

}

.summary-card{

background:#ffffff;

border-radius:12px;

padding:25px;

text-align:center;

box-shadow:0 4px 15px rgba(0,0,0,.08);

transition:.3s;

}

.summary-card:hover{

transform:translateY(-5px);

}

.summary-card h4{

margin:0;

font-size:15px;

color:#666;

}

.summary-card h2{

margin-top:15px;

font-size:30px;

color:#2563eb;

}

/* ==========================================
   System Info
========================================== */

.system-info{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

gap:20px;

padding:15px 0;

}

.system-info div{

background:#f8fafc;

padding:15px;

border-radius:10px;

}

/* ==========================================
   Dashboard Footer
========================================== */

.dashboard-footer{

margin-top:30px;

padding:20px;

text-align:center;

font-size:14px;

color:#777;

border-top:1px solid #e5e7eb;

}
.page-header{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:20px;

}

.search-bar{

display:flex;

gap:10px;

margin-bottom:20px;

}

.search-bar input{

flex:1;

padding:10px;

border:1px solid #ddd;

border-radius:6px;

}

.btn{

padding:8px 16px;

border-radius:6px;

text-decoration:none;

cursor:pointer;

display:inline-block;

font-size:14px;

}

.btn-sm{

padding:5px 10px;

font-size:12px;

}

.btn-primary{

background:#2563eb;

color:#fff;

}

.btn-info{

background:#0ea5e9;

color:#fff;

}

.btn-warning{

background:#f59e0b;

color:#fff;

}

.btn-danger{

background:#dc2626;

color:#fff;

}

.badge{

padding:5px 10px;

border-radius:20px;

font-size:12px;

font-weight:600;

display:inline-block;

}

.badge-success{

background:#16a34a;

color:#fff;

}

.badge-warning{

background:#f59e0b;

color:#fff;

}

.badge-danger{

background:#dc2626;

color:#fff;

}

.badge-secondary{

background:#6b7280;

color:#fff;

}
.form-grid{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:20px;

}

.form-group{

display:flex;

flex-direction:column;

}

.form-group label{

font-weight:600;

margin-bottom:8px;

}

.form-group input,
.form-group select,
.form-group textarea{

padding:10px;

border:1px solid #d1d5db;

border-radius:8px;

font-size:14px;

}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{

border-color:#2563eb;

outline:none;

box-shadow:0 0 5px rgba(37,99,235,.25);

}

.full-width{

grid-column:1/3;

}

.required{

color:red;

}

.alert{

padding:12px;

border-radius:8px;

margin-bottom:20px;

}

.alert-danger{

background:#fee2e2;

color:#991b1b;

}

@media(max-width:768px){

.form-grid{

grid-template-columns:1fr;

}

.full-width{

grid-column:1;

}

}
.page-title-bar{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:25px;

}

.page-title-bar h2{

margin:0;

font-size:30px;

color:#1e3a8a;

}

.page-title-bar p{

margin-top:6px;

color:#666;

}

.btn-lg{

padding:12px 22px;

font-size:15px;

font-weight:600;

}

.filter-bar{

display:flex;

gap:12px;

align-items:center;

}

.form-control{

flex:1;

padding:11px;

border:1px solid #d1d5db;

border-radius:8px;

font-size:15px;

}

.table{

width:100%;

border-collapse:collapse;

margin-top:20px;

}

.table thead{

background:#2563eb;

color:#fff;

}

.table th{

padding:14px;

}

.table td{

padding:14px;

border-bottom:1px solid #eee;

}

.table tbody tr:hover{

background:#f8fafc;

transition:.2s;

}
.table-view th{

background:#f8fafc;

padding:12px;

width:250px;

font-weight:600;

}

.table-view td{

padding:12px;

}
.btn-secondary{
    background:#6c757d;
    color:#fff;
    padding:8px 16px;
    border-radius:5px;
    text-decoration:none;
}

.sidebar-overlay,
.modal-backdrop {
    display: none !important;
}

/* Consistent module statistics cards */
.dashboard-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:20px;
}

.dashboard-card{
    background:#fff;
    padding:18px;
    border-radius:10px;
    box-shadow:0 2px 8px rgba(0,0,0,.08);
    text-align:center;
}

.dashboard-card h3{
    margin:0;
    font-size:14px;
    font-weight:600;
    color:#666;
}

.dashboard-card h2{
    margin-top:10px;
    font-size:24px;
    color:#0d6efd;
}

@media(max-width:992px){
    .dashboard-grid{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:768px){
    .dashboard-grid{
        grid-template-columns:1fr;
    }
}

.ddms-quick-links-card{
    margin-bottom:22px;
}

.ddms-quick-links-heading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:15px;
}

.ddms-quick-links-heading a,
.ddms-quick-empty a{
    color:#1565c0;
    font-weight:600;
    text-decoration:none;
}

.ddms-quick-links{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(155px,1fr));
    gap:14px;
}

.ddms-quick-links a{
    min-height:88px;
    padding:14px;
    border:1px solid #e5e7eb;
    border-left:5px solid var(--link-color);
    border-radius:10px;
    background:#fff;
    color:#243447;
    text-decoration:none;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:8px;
    box-shadow:0 2px 7px rgba(15,23,42,.06);
    transition:transform .15s,box-shadow .15s;
}

.ddms-quick-links a:hover{
    transform:translateY(-2px);
    box-shadow:0 7px 16px rgba(15,23,42,.12);
}

.ddms-quick-links a span{
    font-size:25px;
}

.ddms-quick-links.compact{
    grid-template-columns:repeat(auto-fill,minmax(135px,1fr));
    gap:9px;
}

.ddms-quick-links.compact a{
    min-height:58px;
    padding:10px 12px;
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
}

.ddms-quick-links.compact a span{
    font-size:20px;
}

.ddms-quick-empty{
    padding:16px;
    border-radius:8px;
    background:#f8fafc;
    color:#64748b;
}

.ddms-dashboard-section-title{
    display:flex;
    align-items:end;
    justify-content:space-between;
    margin:8px 0 14px;
}

.ddms-dashboard-section-title h3{
    margin:0;
    color:#243447;
    font-size:20px;
}

.ddms-dashboard-section-title p{
    margin:4px 0 0;
    color:#64748b;
    font-size:13px;
}

.ddms-action-cards{
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
}

.ddms-action-cards .dash-card{
    display:block;
    min-height:190px;
    color:#fff;
    text-decoration:none;
    box-shadow:0 7px 18px rgba(15,23,42,.13);
}

.ddms-action-cards .dash-card .count{
    font-size:29px;
    overflow-wrap:anywhere;
}

.ddms-action-cards .ddms-card-subtitle{
    margin-top:7px;
    color:rgba(255,255,255,.88);
    font-size:13px;
    line-height:1.35;
}

.ddms-record-card{
    display:block;
    min-height:165px;
    color:#fff;
    text-decoration:none;
    box-shadow:0 5px 14px rgba(15,23,42,.11);
}

.ddms-record-card .icon{
    display:inline-grid;
    place-items:center;
    width:46px;
    height:46px;
    border-radius:12px;
    background:rgba(255,255,255,.18);
    font-size:17px;
    font-weight:700;
    letter-spacing:.5px;
}

.ddms-lower-dashboard{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(320px,.75fr);
    gap:24px;
    margin-top:25px;
}

.ddms-panel-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:15px;
    margin-bottom:16px;
}

.ddms-panel-heading h3{
    margin:0;
    color:#243447;
}

.ddms-panel-heading p{
    margin:4px 0 0;
    color:#64748b;
    font-size:13px;
}

.ddms-panel-heading>a{
    color:#1565c0;
    font-weight:600;
    font-size:13px;
    text-decoration:none;
    white-space:nowrap;
}

.ddms-timeline{
    display:grid;
    gap:9px;
}

.ddms-timeline-item{
    display:flex;
    align-items:center;
    gap:13px;
    padding:10px;
    border:1px solid #e5e7eb;
    border-radius:10px;
    color:#243447;
    text-decoration:none;
    transition:background .15s,border-color .15s;
}

.ddms-timeline-item:hover{
    background:#f8fafc;
    border-color:#bfdbfe;
}

.ddms-timeline-date{
    flex:0 0 49px;
    height:49px;
    border-radius:10px;
    background:#eaf2ff;
    color:#1559b7;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

.ddms-timeline-date strong{font-size:19px;line-height:19px}
.ddms-timeline-date span{font-size:11px;text-transform:uppercase}
.ddms-timeline-copy{min-width:0}
.ddms-timeline-copy strong{font-size:14px}
.ddms-timeline-copy small{display:block;margin-top:5px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.ddms-type-badge{
    display:inline-block;
    margin-right:5px;
    padding:3px 7px;
    border-radius:999px;
    background:#e2e8f0;
    color:#475569;
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
}

.ddms-finance-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.ddms-finance-grid>div{
    padding:14px;
    border-radius:10px;
    background:#f8fafc;
}

.ddms-finance-grid span{
    display:block;
    margin-bottom:7px;
    color:#64748b;
    font-size:12px;
}

.ddms-finance-grid strong{font-size:17px;color:#243447}
.ddms-finance-grid .positive{color:#15803d}
.ddms-finance-grid .negative{color:#dc2626}

.ddms-savings-bar{
    height:8px;
    margin-top:16px;
    overflow:hidden;
    border-radius:999px;
    background:#e2e8f0;
}

.ddms-savings-bar span{
    display:block;
    height:100%;
    border-radius:inherit;
    background:#16a34a;
}

.ddms-dashboard-bottom{margin-top:24px}
.ddms-activity-list{display:grid;gap:5px}

.ddms-activity-item{
    display:flex;
    align-items:flex-start;
    gap:11px;
    padding:10px 0;
    border-bottom:1px solid #eef2f7;
}

.ddms-activity-item:last-child{border-bottom:0}
.ddms-activity-item>span{
    flex:0 0 38px;
    height:38px;
    border-radius:50%;
    background:#eaf2ff;
    color:#1559b7;
    display:grid;
    place-items:center;
    font-size:11px;
    font-weight:700;
}

.ddms-activity-item strong{font-size:14px;color:#243447}
.ddms-activity-item p{margin:3px 0;color:#64748b;font-size:12px}
.ddms-activity-item small{color:#94a3b8;font-size:11px}

.ddms-modern-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}

.ddms-modern-actions a{
    min-height:86px;
    padding:14px;
    border:1px solid #e5e7eb;
    border-radius:10px;
    color:#243447;
    text-decoration:none;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:8px;
}

.ddms-modern-actions a:hover{background:#f8fafc;border-color:#93c5fd}
.ddms-modern-actions span{color:#1565c0;font-size:22px;font-weight:700}
.ddms-modern-actions strong{font-size:13px}
.ddms-empty-state{padding:20px;text-align:center;color:#64748b;background:#f8fafc;border-radius:9px}

@media(max-width:1050px){
    .ddms-lower-dashboard{grid-template-columns:1fr}
}

@media(max-width:640px){
    .ddms-finance-grid,.ddms-modern-actions{grid-template-columns:1fr}
    .ddms-timeline-copy small{white-space:normal}
}

/* Global responsive application shell */
.logo-mobile{
    display:none;
}

.logo-desktop{
    font-size:18px !important;
    line-height:1.2;
    font-weight:600 !important;
    white-space:nowrap;
}

.sidebar-overlay{
    position:fixed;
    inset:60px 0 0 0;
    background:rgba(15,23,42,.55);
    z-index:997;
    opacity:0;
    visibility:hidden;
    transition:opacity .25s ease,visibility .25s ease;
}

@media(max-width:900px){
    body{
        overflow-x:hidden !important;
    }

    .topbar{
        height:60px !important;
        padding:0 12px !important;
        gap:10px !important;
    }

    #menu-toggle{
        display:inline-flex !important;
        align-items:center;
        justify-content:center;
        flex:0 0 42px;
        width:42px !important;
        height:42px !important;
        padding:0 !important;
        border:0;
        border-radius:8px;
        background:rgba(255,255,255,.16) !important;
        color:#fff !important;
        font-size:24px;
        line-height:1;
    }

    .top-left{
        min-width:0;
        flex:1 1 auto;
    }

    .logo{
        max-width:100%;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
        font-size:16px !important;
        line-height:1.2 !important;
    }

    .logo-desktop{
        display:none !important;
    }

    .logo-mobile{
        display:block !important;
    }

    .top-center,
    #clock{
        display:none !important;
    }

    .top-right{
        flex:0 0 auto;
        gap:8px !important;
    }

    .user-menu{
        font-size:0 !important;
    }

    .user-menu a{
        display:inline-flex;
        min-height:38px;
        align-items:center;
        padding:0 10px;
        font-size:13px !important;
        border-radius:7px;
        background:rgba(255,255,255,.14);
    }

    .sidebar{
        top:60px !important;
        width:min(86vw,300px) !important;
        height:calc(100dvh - 60px) !important;
        left:0 !important;
        z-index:998 !important;
        transform:translateX(-105%);
        transition:transform .25s ease;
        box-shadow:8px 0 24px rgba(0,0,0,.22);
    }

    body.sidebar-open .sidebar{
        transform:translateX(0);
    }

    .sidebar-overlay{
        display:block !important;
    }

    body.sidebar-open .sidebar-overlay{
        opacity:1;
        visibility:visible;
    }

    body.sidebar-open{
        overflow:hidden !important;
    }

    .content{
        margin-left:0 !important;
        margin-top:74px !important;
        width:100% !important;
        padding:14px !important;
    }

    .card{
        width:100% !important;
        max-width:100% !important;
        padding:16px !important;
        overflow:hidden;
    }

    .page-header{
        display:flex !important;
        flex-wrap:wrap !important;
        align-items:flex-start !important;
        gap:14px !important;
    }

    .page-header > :first-child{
        min-width:0;
        flex:1 1 220px;
    }

    .page-title{
        font-size:24px !important;
        overflow-wrap:anywhere;
    }

    .page-subtitle{
        line-height:1.4;
    }

    .form-grid{
        grid-template-columns:minmax(0,1fr) !important;
        gap:14px !important;
    }

    .form-grid .full-width,
    .full-width{
        grid-column:1 !important;
    }

    input,
    select,
    textarea,
    .form-control{
        max-width:100% !important;
        min-width:0 !important;
    }

    .table{
        display:block;
        width:100% !important;
        max-width:100%;
        overflow-x:auto;
        overflow-y:hidden;
        -webkit-overflow-scrolling:touch;
        white-space:nowrap;
    }

    .table th,
    .table td{
        padding:10px !important;
    }

    .table-view{
        display:table;
        white-space:normal;
    }

    .dashboard-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:12px !important;
    }

    .dashboard-card{
        min-width:0;
        padding:14px !important;
    }

    .dashboard-card h2{
        font-size:20px !important;
        overflow-wrap:anywhere;
    }

    .footer{
        margin-left:0 !important;
        padding:14px !important;
    }
}

@media(max-width:520px){
    .logo{
        font-size:14px !important;
    }

    .notification{
        font-size:18px;
    }

    .content{
        padding:10px !important;
    }

    .card{
        padding:13px !important;
        border-radius:8px !important;
    }

    .page-header > a.btn,
    .page-header > .btn{
        width:100% !important;
        text-align:center;
    }

    .dashboard-grid{
        grid-template-columns:minmax(0,1fr) !important;
    }

    .page-actions{
        width:100%;
        justify-content:flex-start;
    }
}