:root {
  --green:#166b4d;
  --green-2:#0f8b5f;
  --bg:#f4f7f5;
  --card:#ffffff;
  --text:#1f2d2b;
  --muted:#6d7b78;
  --border:#dfe8e4;
  --danger:#c0392b;
  --shadow:0 10px 30px rgba(22,107,77,.08);
}
*{box-sizing:border-box}
body{margin:0;background:linear-gradient(180deg,#f8fbf9,#eef4f1);font-family:'Tajawal',sans-serif;color:var(--text)}
.shell{max-width:1180px;margin:0 auto;padding:24px}
.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px}
.page-header h1{margin:0;color:var(--green);font-size:34px}
.page-header p{margin:8px 0 0;color:var(--muted)}
.page-footer{margin-top:30px;color:var(--muted);font-size:13px;text-align:center}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.card, .panel{background:var(--card);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow)}
.card{padding:24px;text-decoration:none;color:inherit;transition:.2s transform,.2s box-shadow}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 36px rgba(22,107,77,.12)}
.card h2{margin:10px 0 8px;color:var(--green);font-size:21px}
.card p{margin:0;color:var(--muted);line-height:1.7}
.icon-badge{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:#edf7f2;font-size:30px}
.panel{padding:22px;margin-bottom:18px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
label{display:block;font-weight:700;margin-bottom:8px}
input,select,textarea{width:100%;border:1px solid #cfdad5;border-radius:12px;padding:12px 14px;font-family:inherit;font-size:16px;background:#fff}
textarea{min-height:96px;resize:vertical}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.btn,.ghost-link{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:12px;padding:12px 18px;text-decoration:none;cursor:pointer;font-family:inherit;font-size:15px;font-weight:700}
.btn-primary{background:var(--green);color:#fff}
.btn-secondary{background:#edf7f2;color:var(--green)}
.ghost-link{background:#fff;border:1px solid var(--border);color:var(--green)}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{border:1px solid #dfe8e4;padding:12px 10px;text-align:center;vertical-align:middle}
th{background:#edf7f2;color:var(--green);font-size:15px}
.badge{display:inline-flex;border-radius:999px;padding:6px 12px;background:#edf7f2;color:var(--green);font-size:13px;font-weight:700}
.meta-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.meta-item{background:#fbfdfc;border:1px solid var(--border);padding:12px;border-radius:14px;text-align: center;}
.meta-item strong{display:block;color:var(--green);margin-bottom:6px}
.notice{padding:14px 16px;border-radius:14px;background:#edf6ff;color:#23527c;border:1px solid #cfe2ff;margin-bottom:16px}
.error{padding:14px 16px;border-radius:14px;background:#fff2f1;color:var(--danger);border:1px solid #f1c7c2;margin-bottom:16px}
.success{padding:14px 16px;border-radius:14px;background:#edf9f2;color:#18653b;border:1px solid #cfe8d8;margin-bottom:16px}
.report-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
@media print{
  body{background:#fff}
  .page-header .ghost-link,.no-print,.actions,.page-footer{display:none!important}
  .shell{max-width:none;padding:0}
  .panel,.card{box-shadow:none;border:none;padding:0}
  table{font-size:13px}
  th,td{padding:8px}
}
@media (max-width:800px){.grid-2,.grid-3{grid-template-columns:1fr}.page-header{flex-direction:column}}


body {
    font-family: 'Tajawal', sans-serif;
    background: #f5f7fb;
    color: #1f2937;
    margin: 0;
    padding: 0;
}

.shell {
    width: min(1200px, calc(100% - 32px));
    margin: 24px auto;
}

.enhanced-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 22px;
    padding: 20px 24px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.brand-block {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
    flex: 1;
}

.logo-wrap {
    flex-shrink: 0;
    background:linear-gradient(135deg,#0f172a,#0f766e);
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.site-logo {
    height: 82px;
    width: auto;
    display: block;
    object-fit: contain;
}

.title-wrap {
    min-width: 0;
}

.brand-badge {
    display: inline-block;
    font-size: 13px;
    font-weight: 700;
    color: #0f766e;
    background: #ecfeff;
    border: 1px solid #c7f0ee;
    padding: 6px 12px;
    border-radius: 999px;
    margin-bottom: 10px;
}

.title-wrap h1 {
    margin: 0 0 8px;
    font-size: 30px;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.3;
}

.title-wrap p {
    margin: 0;
    font-size: 15px;
    color: #475569;
    line-height: 1.8;
}

.header-actions {
    flex-shrink: 0;
}

.ghost-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    background: #0f766e;
    color: #fff;
    padding: 12px 18px;
    border-radius: 12px;
    font-weight: 700;
    transition: 0.25s ease;
    box-shadow: 0 8px 20px rgba(15, 118, 110, 0.18);
}

.ghost-link:hover {
    background: #0b5e58;
    transform: translateY(-1px);
}

.page-footer {
    text-align: center;
    color: #64748b;
    font-size: 14px;
    padding: 18px 10px 6px;
}

@media (max-width: 768px) {
    .enhanced-header {
        padding: 18px;
    }

    .brand-block {
        flex-direction: column;
        align-items: flex-start;
    }

    .site-logo {
        height: 68px;
    }

    .title-wrap h1 {
        font-size: 24px;
    }

    .title-wrap p {
        font-size: 14px;
    }

    .header-actions {
        width: 100%;
    }

    .ghost-link {
        width: 100%;
    }
}
@media print {
    .page-header,
    .page-footer {
        display: none !important;
    }
}