/* ============================================================
   منصة دال — dal.css  v37  |  MOE navy/blue + gold, RTL
   ============================================================ */
:root{
  --navy-950:#071b3f; --navy-900:#0b2350; --navy-800:#123a78; --navy-700:#16509f;
  --blue-700:#1650a0; --blue-800:#123a78; --blue-900:#0b2350;
  --blue-600:#1b6fd4; --blue-500:#2e86e6; --blue-400:#4da3f5;
  --cta:#1e7be6; --cta-2:#3b93f0; --gold-1:#c9a24b; --gold-2:#e7c766;
  --sky-50:#eaf2fd; --sky-100:#d8e8fb; --ink:#12233f; --muted:#5e7091;
  --cloud:#f4f8fd; --white:#fff; --line:#e6eaf3;
  --shadow:0 24px 60px rgba(11,42,91,.16); --shadow-sm:0 10px 26px rgba(11,42,91,.10);
  --maxw:1180px;
  --dal-svg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cpath d='M44 28 C74 28 88 45 88 68 C88 83 78 92 60 92 L30 92 C25 92 22 89 22 84 C22 79 25 76 30 76 L58 76 C67 76 71 72 71 64 C71 50 63 41 44 41 C39 41 36 38 36 33 C36 28 39 28 44 28 Z' fill='white'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
.dal-scope{font-family:'Tajawal','Segoe UI','Tahoma',sans-serif;color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased}
.dal-scope a{text-decoration:none;color:inherit}
.dal-container{max-width:var(--maxw);margin:0 auto;padding:0 26px}
.dal-page{display:block;width:100%}

/* ============ HERO ============ */
.dal-hero{position:relative;color:#fff;overflow:hidden;
  background:
    radial-gradient(1000px 520px at 50% -12%,#1f57ab,transparent 62%),
    linear-gradient(120deg,#0a1f47 0%,#123a78 52%,#1a5bb0 100%);}
.dal-skyline{position:absolute;inset-inline:0;bottom:60px;width:100%;height:280px;opacity:.10;pointer-events:none}

/* top bar: دال logo (د box + name beside it) LEFT, MOE RIGHT */
.dal-topbar{position:relative;z-index:5}
.dal-topbar-solid{background:linear-gradient(120deg,#0b2350,#123a78)}
.dal-topbar-inner{display:flex;align-items:center;justify-content:space-between;min-height:100px;padding:14px 0;gap:14px;flex-wrap:nowrap}
.dal-brand-left{display:flex;flex-direction:row;align-items:center;gap:12px;flex:none}
.dal-brand-right{display:flex;align-items:center;flex:none}
.dal-mark{width:56px;height:56px;border-radius:16px;flex:none;
  background-image:var(--dal-svg),linear-gradient(rgba(11,35,80,.45),rgba(11,35,80,.45));
  background-size:70%,cover;background-position:center;background-repeat:no-repeat;
  border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.dal-brand-name{font-family:'Cairo','Tajawal',sans-serif;font-weight:800;font-size:1.4rem;color:#fff;letter-spacing:.02em;white-space:nowrap}
.dal-moe-logo{height:62px!important;max-height:62px!important;width:auto!important;max-width:260px!important;display:block!important}
.dal-topbar-inner img{height:62px!important;width:auto!important}

/* hero body */
.dal-hero-body{position:relative;z-index:2;text-align:center;padding:40px 26px 92px}

/* (split hero / laptop removed — hero is centered again) */
.dal-authed-badge{display:inline-flex;align-items:center;gap:8px;margin-bottom:20px;
  background:rgba(46,204,113,.16);border:1px solid rgba(46,204,113,.5);color:#c8f5d8;
  padding:8px 18px;border-radius:30px;font-weight:800;font-size:.9rem}
.dal-authed-badge i{color:#4ee38a}
.dal-hero-logo{width:148px;height:148px;margin:0 auto 24px;border-radius:40px;
  background-image:var(--dal-svg),linear-gradient(rgba(11,35,80,.45),rgba(11,35,80,.45));
  background-size:62%,cover;background-position:center;background-repeat:no-repeat;
  border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.dal-hero-title{font-family:'Cairo','Tajawal','Segoe UI',sans-serif;
  font-size:5.2rem;font-weight:900;line-height:1.08;margin:0;letter-spacing:0;
  text-shadow:0 6px 24px rgba(0,0,0,.35)}
.dal-hero-title .hl{color:var(--blue-400);font-weight:900}
.dal-hero-sub{color:var(--gold-2);font-weight:800;font-size:1.7rem;margin:14px 0 22px}
.dal-hero-welcome{font-size:1.75rem;font-weight:800;color:#fff;margin:0 0 10px}
.dal-hero-welcome b{color:var(--gold-2)}
.dal-hero-lead{font-size:1.15rem;font-weight:800;color:#dbe7fb;max-width:620px;margin:0 auto 34px;line-height:1.9}

/* CTA — glass, big */
.dal-cta{display:inline-flex;align-items:center;gap:12px;font-weight:900;font-size:1.25rem;color:#fff;
  padding:18px 52px;border-radius:16px;background:rgba(255,255,255,.13);
  border:1.5px solid rgba(255,255,255,.4);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 14px 36px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.3);transition:.25s;
  /* force a stable compositing layer so the glass button repaints on back/return
     instead of vanishing until hover (Chrome backdrop-filter repaint bug) */
  transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform}
.dal-cta:hover{transform:translateY(-3px) translateZ(0);background:rgba(255,255,255,.22);color:#fff;
  box-shadow:0 22px 48px rgba(0,0,0,.4)}
.dal-cta i{font-size:1.15rem}

/* hero scroll cue — stylish gold pill down to the portal tracks */
.dal-scope .dal-hero-scroll{display:inline-flex;align-items:center;gap:11px;margin-top:12px;padding:13px 32px;border-radius:40px;
  font-family:'Cairo','Tajawal',sans-serif;font-weight:800;font-size:1.02rem;color:#0b2350;
  background:linear-gradient(135deg,var(--gold-2),var(--gold-1));
  box-shadow:0 14px 30px rgba(201,162,75,.42),inset 0 1px 0 rgba(255,255,255,.55);transition:.25s;transform:translateZ(0)}
.dal-scope .dal-hero-scroll:hover{color:#0b2350;transform:translateY(-2px);box-shadow:0 20px 42px rgba(201,162,75,.55)}
.dal-hero-scroll i{font-size:.92rem;color:#0b2350;animation:dal-bob 1.6s ease-in-out infinite}
@keyframes dal-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
/* login + exit in same row */
.dal-cta-row{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.dal-logout-inline{display:inline-flex}
.dal-cta-ghost{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.28)!important;
  font-size:1.1rem!important;padding:16px 34px!important;color:#e6eefb!important}
.dal-cta-ghost:hover{background:rgba(255,255,255,.14)!important;color:#fff!important}

/* logged-in variant: warmer gold-tinted hero + gold CTA border */
.dal-authed .dal-hero{background:
    radial-gradient(1000px 520px at 50% -12%,#265fae,transparent 62%),
    linear-gradient(120deg,#0a1f47 0%,#143f80 52%,#1c62b8 100%);}
.dal-authed .dal-cta{border-color:rgba(231,199,102,.6);box-shadow:0 14px 36px rgba(201,162,75,.3),inset 0 1px 0 rgba(255,255,255,.3)}
.dal-authed .dal-hero-title .hl{color:var(--gold-2)}

/* wave */
.dal-wave{position:relative;line-height:0;display:block}
.dal-wave svg{display:block;width:100%;height:90px}

@media(max-width:760px){
  /* hide دال logo in top bar on mobile — keep MOE only, centered */
  .dal-brand-left{display:none!important}
  .dal-topbar-inner{min-height:70px;justify-content:center;gap:0}
  .dal-moe-logo,.dal-topbar-inner img{height:46px!important;max-width:200px!important}
  /* hero content */
  .dal-hero-body{padding:14px 20px 56px}
  .dal-hero-logo{width:104px;height:104px;margin-bottom:18px}
  .dal-hero-title{font-size:2.7rem}
  .dal-hero-sub{font-size:1.15rem;margin:8px 0 16px}
  .dal-hero-welcome{font-size:1.25rem}
  .dal-hero-lead{font-size:1rem;margin-bottom:26px}
  .dal-cta{font-size:1.05rem;padding:15px 40px;width:100%;max-width:320px;justify-content:center}
  .dal-cta-ghost{font-size:1rem!important;padding:14px 30px!important;width:100%;max-width:320px}
  .dal-cta-row{flex-direction:column;gap:12px;align-items:center}
  .dal-skyline{display:none}
}

/* ============ PORTAL: SPLIT + PATTERN-TILES MIX (two blue tracks) ============ */
/* navy dotted-pattern band holding two blue track cards */
.dal-portal-section{position:relative;overflow:hidden;padding:52px 0 60px;scroll-margin-top:20px;background:#ffffff}
.dal-portal-section::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(18,58,120,.06) 1.4px,transparent 1.6px);background-size:22px 22px;opacity:1}
.dal-portal-section > .dal-container{position:relative;z-index:2}

.dal-portal-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;max-width:1060px;margin:0 auto;align-items:stretch}
/* card 1 — كحلي + ذهبي، مائل لليسار */
.dal-portal-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;overflow:hidden;color:#fff;
  border-radius:40px 12px 40px 12px;padding:26px 24px;border:1.5px solid rgba(231,199,102,.4);
  box-shadow:0 22px 52px rgba(7,27,63,.4);
  transition:transform .3s ease,box-shadow .3s;background:
    radial-gradient(520px 300px at 80% -12%,rgba(255,255,255,.10),transparent 60%),
    linear-gradient(135deg,#0c2340 0%,#061526 100%)}
.dal-portal-card::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 0l20 20-20 20L0 20zM20 5l15 15-15 15L5 20z' fill='%23ffffff' fill-opacity='0.06' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:32px 32px}
.dal-portal-card:hover{transform:translateY(-6px);box-shadow:0 34px 74px rgba(7,27,63,.5)}
/* card 2 — أزرق زجاجي مستقيم */
.dal-portal-card-b{border-radius:28px;border-color:rgba(56,189,248,.35);
  background:radial-gradient(520px 300px at 20% -12%,rgba(255,255,255,.12),transparent 60%),
    linear-gradient(135deg,#0f2f63 0%,#1e3a8a 100%)}
.dal-portal-card-b::after{background-image:linear-gradient(to right,rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.08) 1px,transparent 1px);background-size:20px 20px}
/* corner watermark icon */
.dal-portal-watermark{position:absolute;inset-inline-end:-6px;bottom:-22px;font-size:6.4rem;line-height:1;
  opacity:.12;pointer-events:none}
/* icon tile — gold on card 1, cyan on card 2; tight spacing below */
.dal-portal-ic{position:relative;z-index:2;width:52px;height:52px;border-radius:15px;display:flex;align-items:center;
  justify-content:center;font-size:1.35rem;margin-bottom:8px;
  background:rgba(231,199,102,.15);border:1px solid rgba(231,199,102,.4);color:var(--gold-2)}
.dal-portal-card-b .dal-portal-ic{background:rgba(56,189,248,.15);border-color:rgba(56,189,248,.35);color:#38bdf8}
.dal-portal-title{position:relative;z-index:2;font-family:'Cairo','Tajawal',sans-serif;font-size:1.42rem;font-weight:900;
  margin:0 0 12px;line-height:1.4;color:#fff}
.dal-portal-desc{position:relative;z-index:2;font-weight:700;font-size:.98rem;line-height:1.7;margin:0 0 20px;flex:1;color:#eaf2fd}
.dal-portal-actions{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:10px;width:100%;margin-top:auto}
.dal-portal-watermark{font-size:5.2rem}

/* التدريب والتأهيل — two small square icon-tiles with the slogan underneath */
.dal-nest-grid{position:relative;z-index:2;width:100%;margin-top:auto;display:grid;grid-template-columns:1fr 1fr;gap:14px;justify-items:center}
.dal-square{display:flex;flex-direction:column;align-items:center;gap:9px;text-decoration:none;text-align:center;transition:.22s;cursor:pointer}
.dal-square:hover{transform:translateY(-3px)}
.dal-square-ic{width:66px;height:66px;border-radius:18px;display:grid;place-items:center;font-size:1.6rem}
.dal-portal-section .dal-square-tag{font-family:'Cairo','Tajawal',sans-serif;font-weight:900;font-size:.9rem;color:#fff}
/* white square — tilted left (مايل) */
.dal-square-white .dal-square-ic{background:#fff;color:#123a78;box-shadow:0 12px 26px rgba(7,27,63,.28);
  transform:rotate(-7deg)}
.dal-square-white:hover .dal-square-ic{transform:rotate(0)}
/* dark blue square — tilted right (مايل) */
.dal-square-navy .dal-square-ic{background:linear-gradient(135deg,#0f4691,#2a7be0);color:#fff;
  border:1px solid rgba(255,255,255,.3);box-shadow:0 12px 26px rgba(7,27,63,.32);transform:rotate(7deg)}
.dal-square-navy:hover .dal-square-ic{transform:rotate(0)}
.dal-square-ic{transition:transform .22s}

/* buttons — card 1 primary GOLD, card 2 primary WHITE; ghost glass on both */
.dal-portal-section .dal-pbtn{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:64px;font-family:'Cairo','Tajawal',sans-serif;font-weight:900;font-size:1.05rem;border:0;border-radius:12px;padding:8px 16px;
  transition:.25s;cursor:pointer;text-align:center;line-height:1.3;
  background:linear-gradient(135deg,var(--gold-1),var(--gold-2))!important;color:#3c2d05!important;
  box-shadow:0 10px 22px rgba(201,162,75,.34)}
.dal-portal-section .dal-pbtn:hover{transform:translateY(-2px);color:#3c2d05!important;box-shadow:0 16px 32px rgba(201,162,75,.46)}
.dal-portal-section .dal-pbtn i{color:#3c2d05!important}
.dal-portal-card-b .dal-pbtn{background:#fff!important;color:#123a78!important;box-shadow:0 10px 22px rgba(7,27,63,.26)}
.dal-portal-card-b .dal-pbtn i{color:#123a78!important}
.dal-portal-section .dal-pbtn-ghost{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:64px;font-family:'Cairo','Tajawal',sans-serif;font-weight:900;font-size:1.05rem;border-radius:12px;padding:8px 16px;
  transition:.25s;cursor:pointer;text-align:center;line-height:1.3;background:rgba(255,255,255,.15);color:#fff;border:1.5px solid rgba(255,255,255,.5);
  backdrop-filter:blur(8px)}
.dal-portal-section .dal-pbtn-ghost:hover{background:rgba(255,255,255,.28);color:#fff;transform:translateY(-2px)}
.dal-portal-section .dal-pbtn i,.dal-portal-section .dal-pbtn-ghost i{font-size:.98rem}
/* card 1 (تحديث): two buttons side by side */
.dal-portal-card:not(.dal-portal-card-b) .dal-portal-actions{flex-wrap:nowrap;gap:10px}
.dal-portal-card:not(.dal-portal-card-b) .dal-portal-actions .dal-pbtn,
.dal-portal-card:not(.dal-portal-card-b) .dal-portal-actions .dal-pbtn-ghost{flex:1;min-width:0}
/* card التدريب: two buttons beside each other (equal height), slogan under the first */
.dal-actions-col{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;column-gap:12px;row-gap:8px;align-items:stretch}
.dal-actions-col .dal-pbtn,.dal-actions-col .dal-pbtn-ghost{width:100%;height:100%}
/* single-button variant: one full-width button */
.dal-portal-card-b .dal-actions-single{grid-template-columns:1fr}
.dal-act-sub{position:relative;z-index:2;grid-column:1;font-family:'Tajawal',sans-serif;font-weight:700;font-size:.84rem;
  color:#cfe0f7;text-align:center;opacity:.92}

@media(max-width:860px){
  /* one column; smaller, more compact cards on mobile */
  .dal-portal-section{padding:38px 0 44px}
  .dal-portal-grid{grid-template-columns:1fr;gap:14px;max-width:440px}
  .dal-portal-card{padding:20px 18px;border-radius:20px}
  .dal-portal-ic{width:46px;height:46px;border-radius:14px;font-size:1.25rem;margin-bottom:12px}
  .dal-portal-title{font-size:1.08rem;margin-bottom:6px}
  .dal-portal-desc{font-size:.9rem;margin-bottom:14px}
  .dal-portal-watermark{font-size:4rem;bottom:-14px}
  .dal-portal-section .dal-pbtn,.dal-portal-section .dal-pbtn-ghost{padding:11px 16px;font-size:.96rem}
  .dal-portal-actions .dal-pbtn,.dal-portal-actions .dal-pbtn-ghost{flex:1 1 100%}
  /* first card: keep buttons beside each other on mobile too */
  .dal-actions-col{grid-template-columns:1fr 1fr;column-gap:10px}
  .dal-actions-col .dal-pbtn,.dal-actions-col .dal-pbtn-ghost{font-size:.9rem;padding:9px 10px}
  /* straighten the tilt on mobile so cards stack cleanly */
  .dal-portal-card{transform:none;border-radius:22px}
  .dal-portal-card-b{transform:none}
  .dal-portal-card:hover{transform:translateY(-4px) scale(1)}
}

/* ============ shared bits ============ */
.dal-steps-frame{width:100%;border-radius:22px;overflow:hidden;
  border:1px solid #eef2f8;box-shadow:0 30px 70px rgba(13,43,107,.18)}
.dal-steps-frame img{width:100%;height:auto;display:block}
.dal-steps-title{font-family:'Cairo','Tajawal',sans-serif;font-size:1.5rem;font-weight:900;color:var(--navy-800);
  margin:0 0 22px;display:flex;align-items:center;gap:12px}
.dal-steps-title i{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--cta),var(--cta-2));
  color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem;flex:none}

/* ============ LOGIN STEPS section (own, white) ============ */
.dal-stepsonly-section{background:#fff;padding:60px 0;scroll-margin-top:20px}
html{scroll-behavior:smooth}
.dal-steps-card{max-width:1240px;margin:0 auto;background:linear-gradient(150deg,#fff 0%,var(--sky-50) 100%);
  border-radius:28px;padding:40px 46px;border:1px solid #eef2f8;box-shadow:0 34px 80px rgba(13,43,107,.14)}
.dal-steps{list-style:none;margin:0;padding:0}
.dal-steps li{display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-bottom:1px dashed #e3ebf6}
.dal-steps li:last-child{border-bottom:0}
.dal-steps .n{width:32px;height:32px;flex:none;border-radius:50%;background:var(--cta);color:#fff;
  font-weight:900;display:flex;align-items:center;justify-content:center;font-size:.95rem;box-shadow:0 4px 10px rgba(30,123,230,.35)}
.dal-steps p{margin:0;color:var(--ink);font-weight:700;line-height:1.7;padding-top:4px}
/* two-column step list on wide screens */
.dal-steps-wide{display:grid;grid-template-columns:1fr 1fr;gap:0 46px}
.dal-steps-wide li{border-bottom:1px dashed #e3ebf6}

/* ============ NOTICE + IMAGE (unified card, light gradient) ============ */
.dal-noteimg-section{background:linear-gradient(180deg,#fff 0%,var(--sky-50) 55%,#eaf1fb 100%);padding:64px 0}
.dal-unified-card{display:grid;grid-template-columns:1fr 1fr;max-width:1240px;margin:0 auto;
  border-radius:28px;overflow:hidden;box-shadow:0 34px 80px rgba(13,43,107,.2);
  border:1px solid rgba(255,255,255,.8);background:#fff}
/* note panel — light gradient, not navy */
.dal-unified-note{background:linear-gradient(150deg,#fff 0%,var(--sky-50) 100%);padding:44px 42px;
  display:flex;flex-direction:column;justify-content:center;border-inline-end:1px solid #eef2f8}
.dal-unified-ic{width:60px;height:60px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  font-size:1.6rem;color:#fff;background:linear-gradient(135deg,var(--gold-1),var(--gold-2));
  box-shadow:0 10px 24px rgba(201,162,75,.35);margin-bottom:18px}
.dal-unified-note h3{font-family:'Cairo','Tajawal',sans-serif;font-size:1.4rem;font-weight:900;color:var(--navy-800);margin:0 0 18px}
.dal-note-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.dal-note-points li{display:flex;gap:12px;align-items:flex-start}
.dal-note-points li i{color:#1e7be6;font-size:1.15rem;margin-top:3px;flex:none}
.dal-note-points li span{color:var(--ink);font-weight:700;line-height:1.7;font-size:1.02rem}
/* image half */
.dal-unified-img{position:relative;min-height:440px;overflow:hidden}
.dal-unified-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
/* safety: cap the raw image even if the grid CSS fails to load */
.dal-noteimg-section img{max-width:100%;object-fit:cover}
@media(max-width:860px){
  .dal-steps-wide{grid-template-columns:1fr;gap:0}
  .dal-steps-card{padding:28px 22px}
  .dal-unified-card{grid-template-columns:1fr}
  .dal-unified-note{order:1;border-inline-end:0;border-bottom:1px solid #eef2f8;padding:32px 26px}
  .dal-unified-img{order:2;min-height:240px}
  .dal-steps-title{font-size:1.3rem}
}

/* ============ FOOTER ============ */
.dal-footer{background:var(--navy-950);color:#b9c9e6;padding:44px 0}
.dal-footer-inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}
.dal-footer-brand{display:flex;align-items:center;gap:12px}
.dal-mark-footer{width:46px;height:46px;border-radius:12px;background-size:64%,cover}
.dal-footer-name{font-family:'Cairo','Tajawal',sans-serif;font-size:1.7rem;font-weight:800;color:#fff;letter-spacing:.02em}
.dal-footer-moe{height:56px!important;max-height:56px!important;width:auto!important;max-width:300px!important}
.dal-footer-inner img{height:56px!important;width:auto!important}
.dal-footer-copy{color:#8ea3cc;font-size:.9rem}

/* ============================================================
   UPDATE-DATA FORM (user/dal/updateData.xhtml)
   ============================================================ */
.dal-form-page{background:var(--cloud);min-height:100vh;padding-bottom:80px}
.dal-form-hero{background:linear-gradient(120deg,var(--blue-800),var(--blue-900));color:#fff;padding:26px 0 80px;position:relative;overflow:hidden}
.dal-form-hero .inner{position:relative;z-index:2}
.dal-form-hero-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.dal-form-hero-text{min-width:0}
.dal-form-brand{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.dal-mark-sm{width:38px;height:38px;border-radius:11px}
.dal-form-brand-name{font-family:'Cairo','Tajawal',sans-serif;font-weight:800;font-size:.95rem;color:var(--gold-2)}
.dal-form-title{font-family:'Cairo','Tajawal',sans-serif;font-size:1.5rem;font-weight:900;margin:0 0 4px;color:#fff}
.dal-form-title i{margin-inline-end:8px;color:var(--blue-400)}
.dal-form-subtitle{color:#C6D6F2;margin:0;font-size:.98rem}
.dal-form-hero h1{font-size:1.9rem;font-weight:900;margin:6px 0 4px}
.dal-form-hero p{color:#C6D6F2;margin:0}
/* small home button in form hero */
.dal-btn-home-sm{background:rgba(255,255,255,.12)!important;border:1.5px solid rgba(255,255,255,.4)!important;
  color:#fff!important;padding:11px 22px!important;border-radius:12px!important;font-weight:800!important;
  backdrop-filter:blur(8px);transition:.25s;white-space:nowrap;flex:none}
.dal-btn-home-sm:hover{background:rgba(255,255,255,.22)!important;color:#fff!important;transform:translateY(-2px)}
.dal-btn-home-sm i{color:var(--gold-2)!important;margin-inline-end:6px}
@media(max-width:640px){
  .dal-form-hero-inner{flex-direction:column;align-items:flex-start;gap:14px}
  .dal-btn-home-sm{width:100%;justify-content:center;display:inline-flex;align-items:center}
  .dal-form-title{font-size:1.3rem}
}
.dal-form-card{max-width:920px;margin:-60px auto 0;position:relative;z-index:3;background:#fff;border-radius:22px;box-shadow:var(--shadow);padding:34px 30px}
.dal-period-banner{display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:14px;margin-bottom:26px;font-weight:700}
.dal-period-ok{background:#E7F6EC;color:#177245;border:1px solid #B7E3C4}
.dal-period-off{background:#FDEDED;color:#B23B3B;border:1px solid #F3C4C4}
.dal-period-banner i{font-size:20px}

.dal-fieldset{border:1px solid var(--line);border-radius:16px;padding:22px 20px 8px;margin-bottom:22px}
.dal-fieldset legend{font-weight:800;color:var(--blue-700);padding:0 10px;font-size:1.05rem}
.dal-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}
.dal-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px 20px}
@media(max-width:720px){.dal-grid,.dal-grid-3{grid-template-columns:1fr}}
.dal-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.dal-field label{font-weight:700;color:var(--ink);font-size:.92rem}
.dal-field .req{color:#D33;margin-inline-start:3px}
.dal-readonly{background:var(--cloud);border:1px solid var(--line);border-radius:10px;padding:11px 14px;color:var(--blue-800);font-weight:700}
.dal-field .hint{font-size:.78rem;color:var(--muted)}
/* PrimeFaces control normalization */
.dal-form-card .ui-inputfield,.dal-form-card .ui-selectonemenu,.dal-form-card .ui-inputtext{width:100%!important;border-radius:10px!important}
.dal-form-card .ui-selectonemenu{display:flex;align-items:center}

/* attachment */
.dal-attach{border:2px dashed var(--sky-100);border-radius:16px;padding:22px;text-align:center;background:var(--sky-50)}
.dal-attach .ico{font-size:34px;color:var(--blue-500);margin-bottom:10px}
.dal-attach h4{margin:0 0 4px;color:var(--blue-800);font-weight:800}
.dal-attach p{margin:0 0 14px;color:var(--muted);font-size:.86rem}
.dal-attach-preview{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;align-items:center;gap:14px;justify-content:space-between}
.dal-attach-preview .meta{display:flex;align-items:center;gap:10px;color:var(--blue-800);font-weight:700}
.dal-attach-preview .meta i{font-size:22px;color:var(--blue-600)}
.dal-attach-media{margin-top:16px;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.dal-attach-media img{max-width:100%;display:block}
/* fileUpload choose button: always show label (even on mobile) */
.dal-attach .ui-fileupload-buttonbar{background:transparent!important;border:0!important;padding:0!important}
.dal-attach .ui-fileupload-choose{position:relative!important;background:linear-gradient(135deg,var(--cta),var(--cta-2))!important;
  border:0!important;color:#fff!important;border-radius:12px!important;padding:12px 26px!important;font-weight:800!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;width:auto!important}
/* reset PrimeFaces absolute icon positioning so it doesn't overlap the label */
.dal-attach .ui-fileupload-choose .ui-icon,.dal-attach .ui-fileupload-choose .ui-button-icon-left{
  position:static!important;margin:0!important;left:auto!important;right:auto!important;top:auto!important;
  display:inline-flex!important;align-items:center!important;width:auto!important;height:auto!important;
  text-indent:0!important;color:#fff!important;font-size:1rem!important}
.dal-attach .ui-fileupload-choose .ui-button-text{position:static!important;display:inline-block!important;visibility:visible!important;
  padding:0!important;margin:0!important;text-indent:0!important;line-height:1!important;font-size:1rem!important;color:#fff!important}
.dal-attach .ui-fileupload-choose.ui-button-text-icon-left .ui-button-text{padding:0!important}
.dal-attach .ui-fileupload-choose:hover{filter:brightness(1.06)}
@media(max-width:600px){
  .dal-attach .ui-fileupload-choose{width:100%!important;justify-content:center!important;padding:14px!important}
  .dal-attach .ui-fileupload-choose .ui-button-text{display:inline-block!important;visibility:visible!important}
}

.dal-submit-row{display:flex;justify-content:flex-end;gap:12px;margin-top:10px}

/* success page */
.dal-success{max-width:720px;margin:60px auto;text-align:center;background:#fff;border-radius:24px;box-shadow:var(--shadow);padding:56px 40px}
.dal-check{width:120px;height:120px;margin:0 auto 26px;border-radius:50%;background:#E7F6EC;display:flex;align-items:center;justify-content:center;
  animation:dal-pop .5s ease}
.dal-check i{font-size:64px;color:#22A155}
@keyframes dal-pop{0%{transform:scale(.5);opacity:0}70%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
.dal-success h2{font-size:2rem;font-weight:900;color:#177245;margin:0 0 14px}
.dal-success p{font-size:1.1rem;color:var(--ink);line-height:1.9;max-width:560px;margin:0 auto 10px}
.dal-success .note{color:var(--muted);font-size:.95rem;margin-top:18px}
.dal-success .actions{margin-top:28px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ============ dialogs / doc actions ============ */
.dal-doc-actions{display:inline-flex;gap:8px;flex-wrap:wrap}
.dal-btn-danger,.dal-btn-danger .ui-button-text,.dal-btn-danger .ui-icon,.dal-btn-danger i{color:#fff!important}
.dal-btn-danger{border-color:#D32F2F!important;background:#D32F2F!important}
.dal-btn-danger:hover,.dal-btn-danger:hover .ui-button-text,.dal-btn-danger:hover i{color:#fff!important}
.dal-btn-danger:hover{background:#B71C1C!important;border-color:#B71C1C!important}
.dal-badge-staged{background:#FFF6E0;color:#946200;border:1px solid #F0D896;border-radius:20px;
  padding:2px 10px;font-size:.72rem;font-weight:700;margin-inline-start:8px}

/* message dialog */
.dal-msg-dialog .ui-dialog-content{padding:0!important}
.dal-msg-body{padding:30px 26px 24px;text-align:center;font-family:'Tajawal','Segoe UI',sans-serif}
.dal-msg-ico{width:74px;height:74px;margin:0 auto 14px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:38px}
.dal-msg-body.dal-success .dal-msg-ico{background:#E7F6EC;color:#22A155}
.dal-msg-body.dal-warn .dal-msg-ico{background:#FFF4E0;color:#C8890A}
.dal-msg-body.dal-error .dal-msg-ico{background:#FDECEC;color:#C0392B}
.dal-msg-body h3{font-size:1.25rem;font-weight:900;margin:0 0 8px;color:var(--blue-800)}
.dal-msg-body.dal-error h3{color:#C0392B}
.dal-msg-body.dal-warn h3{color:#C8890A}
.dal-msg-body p{color:var(--ink);margin:0 0 20px;line-height:1.8}
.dal-msg-body .dal-btn{min-width:120px;justify-content:center}

/* ============ attestation ============ */
.dal-attest{display:flex;align-items:flex-start;gap:12px;background:var(--sky-50);
  border:1px solid var(--sky-100);border-radius:14px;padding:16px 18px;margin:6px 0 18px}
.dal-attest .dal-attest-label{font-weight:800;color:var(--blue-800);cursor:pointer;line-height:1.7}
.dal-attest .ui-chkbox{margin-top:2px}

/* ============ media dialog: large, PDF fits content ============ */
.dal-media-dialog.ui-dialog{width:90vw!important;max-width:1200px!important;height:88vh!important;max-height:88vh!important}
.dal-media-dialog .ui-dialog-content{padding:0!important;height:calc(88vh - 46px)!important;max-height:calc(88vh - 46px)!important;overflow:hidden!important;background:#525659;display:flex}
.dal-media-wrap{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:auto}
.dal-media-wrap .dal-media-pdf,.dal-media-wrap object,.dal-media-wrap embed,.dal-media-wrap iframe{width:100%!important;height:100%!important;min-height:100%!important;border:0;display:block}
.dal-media-wrap .dal-media-img,.dal-media-wrap img{max-width:100%!important;max-height:100%!important;width:auto!important;height:auto!important;object-fit:contain;border-radius:6px;box-shadow:0 6px 24px rgba(0,0,0,.4);margin:auto}
@media(max-width:768px){
  .dal-media-dialog.ui-dialog{width:100vw!important;max-width:100vw!important;height:92vh!important;max-height:92vh!important;left:0!important;top:2vh!important}
  .dal-media-dialog .ui-dialog-content{height:calc(92vh - 44px)!important;max-height:calc(92vh - 44px)!important}
}

/* ============ success page: name + cid ============ */
.dal-success-id{display:flex;gap:22px;justify-content:center;flex-wrap:wrap;margin:0 0 16px}
.dal-success-id span{display:inline-flex;align-items:center;gap:8px;background:var(--sky-50);
  border:1px solid var(--sky-100);border-radius:30px;padding:8px 18px;font-weight:800;color:var(--blue-800)}
.dal-success-id i{color:var(--blue-500)}

/* ============ doc action buttons: even spacing ============ */
.dal-doc-actions{display:inline-flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.dal-attach-preview{gap:16px}
@media(max-width:560px){
  .dal-attach-preview{flex-direction:column;align-items:stretch}
  .dal-doc-actions{justify-content:center}
  .dal-doc-actions .dal-btn{flex:1;justify-content:center}
}


/* ============ success: home button (distinct polished style) ============ */
.dal-btn-home{background:linear-gradient(135deg,var(--navy-800),var(--navy-900))!important;color:#fff!important;
  border:0!important;padding:14px 34px!important;border-radius:14px!important;font-weight:900!important;
  box-shadow:0 12px 28px rgba(11,42,91,.35)!important;transition:.25s}
.dal-btn-home:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(11,42,91,.45)!important;
  background:linear-gradient(135deg,var(--navy-700),var(--navy-800))!important;color:#fff!important}
.dal-btn-home i{color:var(--gold-2)!important;margin-inline-end:8px}