/* v33 — طبقة التصميم الفاخر (للشاشة فقط، لا تؤثر على الطباعة) */
@media screen{
  :root{
    --lx-navy:#06255f; --lx-blue:#0a3d91; --lx-sky:#078ed5; --lx-mint:#00a978;
    --lx-ink:#0f2c55; --lx-line:#d6e6f1;
    --lx-glass:rgba(255,255,255,.78);
    --lx-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 24px 60px -18px rgba(10,61,145,.22),0 4px 14px rgba(10,61,145,.06);
  }
  html{scroll-behavior:smooth}
  body{font-family:"Tajawal",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
  body::selection,*::selection{background:rgba(7,142,213,.22)}

  /* خلفية حية */
  body{
    background:
      radial-gradient(60rem 34rem at 100% -8%,rgba(0,169,120,.16),transparent 60%),
      radial-gradient(52rem 32rem at -5% 12%,rgba(7,142,213,.18),transparent 60%),
      radial-gradient(40rem 26rem at 50% 108%,rgba(10,61,145,.10),transparent 60%),
      linear-gradient(180deg,#f6fbff,#e9f5fc 55%,#f4fbff)!important;
    background-attachment:fixed!important;
  }

  /* الترويسة */
  .app-shell .topbar{
    background:var(--lx-glass)!important;backdrop-filter:blur(18px) saturate(1.4);
    border:1px solid rgba(255,255,255,.85)!important;border-radius:28px!important;box-shadow:var(--lx-shadow)!important;
    position:relative;overflow:hidden;
  }
  .app-shell .topbar::after{
    content:"";position:absolute;inset:auto 0 0 0;height:5px;
    background:linear-gradient(90deg,var(--lx-blue),var(--lx-sky) 55%,var(--lx-mint));
  }
  .app-shell .topbar h1{
    background:linear-gradient(120deg,var(--lx-navy),var(--lx-sky) 85%);-webkit-background-clip:text;background-clip:text;
    color:transparent!important;font-weight:900;letter-spacing:-.2px
  }
  .app-shell .topbar .clock{background:rgba(255,255,255,.9)!important;border:1px solid var(--lx-line)!important;box-shadow:0 4px 12px rgba(10,61,145,.07)}
  .user-badge:empty{display:none!important}
  .user-badge:not(:empty){
    background:linear-gradient(135deg,#e7f2ff,#e5f9f1)!important;border:1px solid #cfe3f1!important;color:var(--lx-blue)!important;font-weight:800
  }
  .topbar-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important;justify-content:flex-start!important;align-items:center}
  @media(min-width:1100px){.topbar-actions{flex-wrap:nowrap!important}.topbar-actions .button{padding-inline:14px!important;white-space:nowrap}}
  .auto-number-wrap{border:1.5px solid var(--lx-line);border-radius:16px;background:#fff;transition:border-color .18s,box-shadow .18s}
  .auto-number-wrap:focus-within{border-color:var(--lx-sky);box-shadow:0 0 0 5px rgba(7,142,213,.14)}
  .field .auto-number-wrap input{border:0!important;box-shadow:none!important;background:transparent!important}

  /* الأزرار */
  .button{font-family:inherit;font-weight:800;border-radius:15px;transition:transform .18s,box-shadow .18s,background .18s,filter .18s!important}
  .top-action{
    background:#fff!important;border:1px solid var(--lx-line)!important;color:var(--lx-blue)!important;
    box-shadow:0 4px 12px rgba(10,61,145,.06)!important;min-height:48px
  }
  .top-action:hover{transform:translateY(-3px)!important;box-shadow:0 14px 26px rgba(10,61,145,.16)!important;border-color:#a9d3ee!important}
  .top-action svg{stroke:currentColor}
  .chat-action{
    background:linear-gradient(135deg,var(--lx-blue),var(--lx-sky))!important;color:#fff!important;border:0!important;
    box-shadow:0 12px 26px rgba(10,79,180,.38)!important;position:relative
  }
  .chat-action:hover{filter:brightness(1.08)}
  .chat-action svg{stroke:#fff!important}
  .chat-action .action-badge{
    background:linear-gradient(135deg,#ff6b6b,#e5484d)!important;color:#fff!important;border:2px solid #fff;
    box-shadow:0 4px 10px rgba(229,72,77,.5);animation:lx-ping 2s infinite
  }
  @keyframes lx-ping{0%,100%{transform:scale(1)}50%{transform:scale(1.14)}}
  .button-primary{
    background:linear-gradient(135deg,var(--lx-blue),var(--lx-sky))!important;box-shadow:0 12px 24px rgba(10,79,180,.32)!important;border:0!important
  }
  .button-primary:hover{transform:translateY(-3px)!important;box-shadow:0 18px 32px rgba(10,79,180,.42)!important}
  .button-outline,.button-muted{border-radius:15px}
  .button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid rgba(7,142,213,.35);outline-offset:2px}

  /* شريط الملخص */
  .summary-strip{
    border-radius:26px!important;border:0!important;position:relative;overflow:hidden;
    background:
      radial-gradient(28rem 12rem at 8% 120%,rgba(0,169,120,.55),transparent 65%),
      radial-gradient(26rem 14rem at 95% -30%,rgba(7,142,213,.7),transparent 65%),
      linear-gradient(120deg,var(--lx-navy),var(--lx-blue) 60%,#0b72c6)!important;
    box-shadow:0 26px 50px -18px rgba(7,42,108,.55)!important
  }
  .summary-strip strong{
    font-weight:900;text-shadow:0 6px 24px rgba(0,0,0,.25);font-variant-numeric:tabular-nums
  }
  .summary-strip .storage-note{
    background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.3)!important;color:#fff!important;backdrop-filter:blur(8px);font-weight:700
  }

  /* اللوحات */
  .panel{
    background:var(--lx-glass)!important;backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.9)!important;
    border-radius:28px!important;box-shadow:var(--lx-shadow)!important;transition:box-shadow .3s,transform .3s
  }
  .panel:hover{box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 30px 70px -18px rgba(10,61,145,.28),0 4px 14px rgba(10,61,145,.06)!important}
  .section-heading h2,.table-head h2,.search-copy h2{font-weight:900;color:var(--lx-ink)}
  .eyebrow{color:var(--lx-mint)!important;font-weight:900;letter-spacing:.3px}

  /* الحقول */
  .field label{font-weight:800;color:var(--lx-ink)}
  .field input,.field textarea,.field select,.search-box input,input[type="search"]{
    background:#fff!important;border:1.5px solid var(--lx-line)!important;border-radius:16px!important;
    transition:border-color .18s,box-shadow .18s!important;font-family:inherit
  }
  .field input:focus,.field textarea:focus,.field select:focus,input[type="search"]:focus{
    border-color:var(--lx-sky)!important;box-shadow:0 0 0 5px rgba(7,142,213,.14)!important;outline:0
  }

  /* الجدول */
  .table-wrap{border:1px solid var(--lx-line)!important;border-radius:20px!important;box-shadow:0 10px 30px -14px rgba(10,61,145,.18)}
  thead tr{background:linear-gradient(120deg,var(--lx-navy),var(--lx-blue) 60%,#0b72c6)}
  thead th{background:transparent!important;font-weight:800;letter-spacing:.2px}
  tbody tr{transition:background .15s,transform .15s}
  tbody tr:nth-child(even){background:#f6fafd}
  tbody tr:hover{background:#e8f4fd!important}
  tbody td{border-color:#e4eef5!important}
  .count-badge{background:linear-gradient(135deg,#e5f9f1,#e7f2ff)!important;border:1px solid #c8e8dc!important;color:#08856a!important;font-weight:900}
  .empty-state{opacity:.95}

  /* دخول وقفل */
  .login-card{
    background:rgba(255,255,255,.82)!important;backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.95)!important;
    border-radius:32px!important;box-shadow:0 40px 90px -24px rgba(10,61,145,.4),0 6px 18px rgba(10,61,145,.08)!important
  }
  .login-mark{filter:drop-shadow(0 24px 40px rgba(10,61,145,.22));border-radius:34px;overflow:hidden;box-shadow:0 30px 70px -20px rgba(10,61,145,.35)}
  .login-heading h1{
    background:linear-gradient(120deg,var(--lx-navy),var(--lx-sky));-webkit-background-clip:text;background-clip:text;color:transparent!important
  }
  .login-button{box-shadow:0 16px 32px rgba(0,120,170,.38)!important;transition:transform .18s,box-shadow .18s}
  .login-button:hover{transform:translateY(-3px);box-shadow:0 22px 40px rgba(0,120,170,.46)!important}

  /* نوافذ منبثقة */
  .modal-card{border-radius:30px!important;box-shadow:0 40px 100px -20px rgba(3,31,69,.55)!important}
  .modal-backdrop{backdrop-filter:blur(12px)}

  /* ظهور متدرج */
  .app-shell:not(.hidden)>.panel{animation:lx-rise .6s cubic-bezier(.2,.8,.2,1) both}
  .app-shell:not(.hidden)>.panel:nth-of-type(2){animation-delay:.08s}
  .app-shell:not(.hidden)>.panel:nth-of-type(3){animation-delay:.16s}
  @keyframes lx-rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

  ::-webkit-scrollbar{width:10px;height:10px}
  ::-webkit-scrollbar-thumb{background:#bcd3e4;border-radius:10px;border:2px solid transparent;background-clip:padding-box}
  ::-webkit-scrollbar-thumb:hover{background:#8fb5d1;background-clip:padding-box;border:2px solid transparent}
}
@media screen and (max-width:700px){
  .app-shell .topbar,.panel{border-radius:22px!important}
  .topbar-actions .top-action{flex:1 1 calc(50% - 10px)}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
