/* ASASI.CSS — Aurea Journal Platform
   Palette: light blue / navy, premium and academic. No external fonts/libraries. */

:root{
  --dhahab: #2f6fb0;        /* primary blue */
  --dhahab-ghamiq: #0f3a66; /* deep navy (hover/active) */
  --dhahab-fatih: #d7e6f8;  /* light blue accent */
  --ivory: #f5f8fc;         /* page background */
  --ivory-2: #e9f1fa;       /* panel background */
  --white: #ffffff;
  --ink: #17263a;           /* primary text */
  --ink-soft: #5b6b80;      /* secondary text */
  --line: #dbe6f2;          /* borders */
  --ok: #3f7d4e;
  --warn: #b3711b;
  --err: #a63b3b;
  --shadow: 0 4px 18px rgba(15, 40, 75, 0.10);
  --shadow-lg: 0 12px 40px rgba(15, 40, 75, 0.18);
  --radius: 14px;
  --font-serif: Georgia, 'Times New Roman', serif;
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --speed: .28s;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; background:var(--ivory); color:var(--ink);
  font-family:var(--font-sans); line-height:1.6; font-size:16px;
  -webkit-font-smoothing:antialiased;
  animation:fadeIn .5s ease both;
}
h1,h2,h3,h4{ font-family:var(--font-serif); color:var(--ink); line-height:1.25; margin:0 0 .5em; }
a{ color:var(--dhahab-ghamiq); text-decoration:none; transition:color var(--speed) ease; }
a:hover{ color:var(--dhahab); }
img{ max-width:100%; display:block; }
p{ margin:0 0 1em; }
::selection{ background:var(--dhahab-fatih); color:var(--ink); }

/* ---------- Layout ---------- */
.hawiya{ max-width:1180px; margin:0 auto; padding:0 24px; }
.amoud-qiraa{ max-width:760px; }
.amoud-qiraa-lg{ max-width:820px; }
.shabaka{ display:grid; gap:24px; }
.amoud-2{ grid-template-columns: 2fr 1fr; }
@media (max-width: 860px){ .amoud-2{ grid-template-columns:1fr; } }

/* ---------- Navbar ---------- */
.shareet{
  position:sticky; top:0; z-index:50; background:rgba(245,248,252,.92);
  backdrop-filter:saturate(160%) blur(8px);
  border-bottom:1px solid var(--line);
}
.shareet-dakhili{
  max-width:1180px; margin:0 auto; padding:14px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.shiar{ display:flex; align-items:center; gap:10px; font-family:var(--font-serif); font-size:1.35rem; font-weight:700; color:var(--ink); }
.shiar .nuqta{ width:10px; height:10px; border-radius:50%; background:var(--dhahab); box-shadow:0 0 0 4px var(--dhahab-fatih); }
.qaimat-tanqul{ display:flex; gap:26px; list-style:none; margin:0; padding:0; align-items:center; }
.qaimat-tanqul a{ color:var(--ink-soft); font-weight:600; font-size:.95rem; position:relative; padding:6px 0; }
.qaimat-tanqul a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--dhahab);
  transition:width var(--speed) ease;
}
.qaimat-tanqul a:hover::after, .qaimat-tanqul a.nashit::after{ width:100%; }
.qaimat-tanqul a.nashit{ color:var(--ink); }
.zir-qaimat{ display:none; }
@media (max-width: 780px){
  .qaimat-tanqul{ display:none; }
  .zir-qaimat{ display:flex; }
}

/* ---------- Buttons ---------- */
.zir{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 22px; border-radius:999px; border:1px solid transparent; cursor:pointer;
  font-weight:700; font-size:.92rem; font-family:var(--font-sans);
  transition: transform var(--speed) ease, box-shadow var(--speed) ease, background var(--speed) ease, color var(--speed) ease;
  text-decoration:none; position:relative; overflow:hidden;
}
.zir-mawja{
  position:absolute; border-radius:50%; background:rgba(255,255,255,.55); pointer-events:none;
  transform:scale(0); animation:mawja-tawassu .6s ease-out forwards;
}
.zir-thanawi .zir-mawja{ background:rgba(47,111,176,.25); }
@keyframes mawja-tawassu{ to{ transform:scale(2.6); opacity:0; } }
.zir-asasi{ background:var(--dhahab); color:#fff; box-shadow:var(--shadow); }
.zir-asasi:hover{ background:var(--dhahab-ghamiq); transform:translateY(-2px); box-shadow:var(--shadow-lg); color:#fff; }
.zir-thanawi{ background:transparent; border-color:var(--line); color:var(--ink); }
.zir-thanawi:hover{ border-color:var(--dhahab); color:var(--dhahab-ghamiq); transform:translateY(-2px); }
.zir-khatar{ background:var(--err); color:#fff; }
.zir-sm{ padding:7px 14px; font-size:.82rem; }
.zir:active{ transform:translateY(0) scale(.98); }

/* ---------- Hero ---------- */
.batal{
  padding:96px 0 72px; text-align:center; position:relative; overflow:hidden;
  background: var(--ivory);
}
.batal-mizaj{
  position:absolute; inset:0; z-index:0; pointer-events:none;
}
.batal-mizaj span{
  position:absolute; border-radius:50%; filter:blur(70px); opacity:.5;
  animation: mizaj-taaw 20s ease-in-out infinite;
}
.batal-mizaj span:nth-child(1){ width:480px; height:480px; background:radial-gradient(circle, var(--dhahab-fatih), transparent 70%); top:-200px; left:-100px; }
.batal-mizaj span:nth-child(2){ width:420px; height:420px; background:radial-gradient(circle, #c9def4, transparent 70%); bottom:-220px; right:-80px; animation-delay:-7s; animation-duration:24s; }
.batal-mizaj span:nth-child(3){ width:320px; height:320px; background:radial-gradient(circle, #aecdec, transparent 70%); top:20%; right:15%; animation-delay:-13s; animation-duration:17s; }
@keyframes mizaj-taaw{
  0%,100%{ transform:translate(0,0) scale(1); }
  33%{ transform:translate(50px,35px) scale(1.18); }
  66%{ transform:translate(-35px,25px) scale(.88); }
}
.batal-daw2{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0;
  background: radial-gradient(420px circle at var(--mx,50%) var(--my,25%), rgba(47,111,176,.22), transparent 70%);
  transition: opacity .4s ease;
}
.batal:hover .batal-daw2{ opacity:1; }
.batal > .hawiya{ position:relative; z-index:1; }
.batal h1{ font-size:clamp(2rem, 5vw, 3.4rem); margin-bottom:.3em; animation:riseIn .7s ease both; }
.batal p{ font-size:1.15rem; color:var(--ink-soft); max-width:620px; margin:0 auto 2em; animation:riseIn .7s .1s ease both; }
.batal .afaal{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; animation:riseIn .7s .2s ease both; }

@media (prefers-reduced-motion: reduce){
  .batal-mizaj span{ animation:none; }
  .batal-daw2{ display:none; }
}

/* ---------- Cards ---------- */
.bitaqa{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:26px; box-shadow:var(--shadow); transition: transform var(--speed) ease, box-shadow var(--speed) ease;
  animation:riseIn .5s ease both;
}
.bitaqa:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.shabakat-bataqat{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:22px; }

.bitaqa-maqal h3{ font-size:1.2rem; margin-bottom:.35em; }
.bitaqa-maqal h3 a{ color:var(--ink); }
.bitaqa-maqal h3 a:hover{ color:var(--dhahab-ghamiq); }
.wasf-mukhtasar{ color:var(--ink-soft); font-size:.95rem; margin-bottom:14px; }
.wasm-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.wasm{ background:var(--ivory-2); border:1px solid var(--line); border-radius:999px; padding:3px 12px; font-size:.78rem; color:var(--ink-soft); }

/* ---------- Status pills ---------- */
.hala-pill{ display:inline-block; padding:4px 12px; border-radius:999px; font-size:.78rem; font-weight:700; }
.hala-submitted{ background:#eef1f6; color:#3b4a63; }
.hala-review{ background:#fdf2df; color:var(--warn); }
.hala-revision{ background:#fde9e0; color:#a5552a; }
.hala-accepted{ background:#e4f3e6; color:var(--ok); }
.hala-rejected{ background:#fbe6e6; color:var(--err); }
.hala-published{ background:var(--dhahab-fatih); color:var(--dhahab-ghamiq); }
.hala-default{ background:var(--ivory-2); color:var(--ink-soft); }

/* ---------- Forms ---------- */
.namouzaj{ max-width:480px; margin:0 auto; }
.haql{ margin-bottom:18px; }
.haql label{ display:block; font-weight:700; font-size:.88rem; margin-bottom:6px; color:var(--ink); }
.haql input, .haql select, .haql textarea{
  width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:10px;
  background:var(--white); font-family:inherit; font-size:.95rem; color:var(--ink);
  transition:border-color var(--speed) ease, box-shadow var(--speed) ease;
}
.haql input:focus, .haql select:focus, .haql textarea:focus{
  outline:none; border-color:var(--dhahab); box-shadow:0 0 0 4px var(--dhahab-fatih);
}
.haql textarea{ min-height:120px; resize:vertical; }
.namouzaj-bitaqa{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:40px; box-shadow:var(--shadow); animation:riseIn .5s ease both; }
.risala{ padding:12px 16px; border-radius:10px; margin-bottom:18px; font-size:.9rem; }
.risala-khataa{ background:#fbe6e6; color:var(--err); border:1px solid #f2c9c9; }
.risala-najah{ background:#e4f3e6; color:var(--ok); border:1px solid #c7e6cc; }

/* ---------- Tables ---------- */
.jadwal-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); background:var(--white); }
table.jadwal{ width:100%; border-collapse:collapse; min-width:600px; }
table.jadwal th, table.jadwal td{ padding:14px 16px; text-align:left; border-bottom:1px solid var(--line); font-size:.92rem; }
table.jadwal th{ background:var(--ivory-2); font-family:var(--font-serif); color:var(--ink); }
table.jadwal tr{ transition:background var(--speed) ease; }
table.jadwal tbody tr:hover{ background:var(--ivory); }

/* ---------- Dashboard shell ---------- */
.lawha-shell{ display:grid; grid-template-columns:250px 1fr; min-height:calc(100vh - 68px); }
@media (max-width:900px){ .lawha-shell{ grid-template-columns:1fr; } }
.lawha-janib{ background:var(--white); border-right:1px solid var(--line); padding:28px 18px; }
@media (max-width:900px){ .lawha-janib{ border-right:none; border-bottom:1px solid var(--line); } }
.lawha-janib a{ display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:10px; color:var(--ink-soft); font-weight:600; margin-bottom:4px; transition:background var(--speed) ease, color var(--speed) ease; }
.lawha-janib a:hover{ background:var(--ivory-2); color:var(--ink); }
.lawha-janib a.nashit{ background:var(--dhahab-fatih); color:var(--dhahab-ghamiq); }
.lawha-muhtawa{ padding:32px 24px; }
.lawha-ras{ display:flex; justify-content:space-between; align-items:center; margin-bottom:26px; flex-wrap:wrap; gap:14px; }

.ihsaiyat{ display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:18px; margin-bottom:30px; }
.ihsaa-bitaqa{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow); animation:riseIn .5s ease both; }
.ihsaa-bitaqa .raqm{ font-family:var(--font-serif); font-size:2.1rem; color:var(--dhahab-ghamiq); }
.ihsaa-bitaqa .taasmiya{ color:var(--ink-soft); font-size:.85rem; text-transform:uppercase; letter-spacing:.05em; }

/* ---------- Long-form description / abstract text ---------- */
.wasf-jurnal{
  max-width:720px; margin-top:18px; padding:22px 26px; background:var(--white);
  border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow);
}
.wasf-jurnal p{ color:var(--ink-soft); font-size:1.05rem; line-height:1.75; margin:0; }
@media (max-width:700px){ .wasf-jurnal{ padding:18px 20px; } }

/* ---------- PDF actions (View Full opens the browser's own PDF renderer) ---------- */
.pdf-afaal{ display:flex; gap:12px; flex-wrap:wrap; margin-top:18px; }
.pdf-afaal .zir{ padding:13px 26px; }

.pdf-marja{
  width:100%; height:75vh; min-height:480px; border:1px solid var(--line);
  border-radius:var(--radius); background:var(--ivory-2); box-shadow:var(--shadow);
  overflow:hidden; margin-top:20px; animation:riseIn .5s ease both;
}
.pdf-marja object{ width:100%; height:100%; display:block; }
.pdf-marja-fallback{ padding:50px 24px; text-align:center; color:var(--ink-soft); height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; }

/* ---------- Footer ---------- */
.dhayl{ background:var(--ink); color:#d9e6f5; padding:50px 0 30px; margin-top:80px; }
.dhayl a{ color:#d9e6f5; opacity:.85; }
.dhayl a:hover{ color:var(--dhahab-fatih); opacity:1; }
.dhayl small{ opacity:.6; }

/* ---------- Animations ---------- */
@keyframes fadeIn{ from{ opacity:0 } to{ opacity:1 } }
@keyframes riseIn{ from{ opacity:0; transform:translateY(14px) } to{ opacity:1; transform:translateY(0) } }
@keyframes pulse{ 0%,100%{ opacity:1 } 50%{ opacity:.55 } }
.taahmil{ animation:pulse 1.2s ease-in-out infinite; }

.dhahir-taddarrujiyy{ opacity:0; transform:translateY(20px); transition:opacity .6s ease, transform .6s ease; }
.dhahir-taddarrujiyy.mar2i{ opacity:1; transform:translateY(0); }
/* Staggered reveal for grids: each card in a row animates slightly after the previous one. */
.shabakat-bataqat > .dhahir-taddarrujiyy:nth-child(1){ transition-delay:0s; }
.shabakat-bataqat > .dhahir-taddarrujiyy:nth-child(2){ transition-delay:.08s; }
.shabakat-bataqat > .dhahir-taddarrujiyy:nth-child(3){ transition-delay:.16s; }
.shabakat-bataqat > .dhahir-taddarrujiyy:nth-child(4){ transition-delay:.24s; }
.shabakat-bataqat > .dhahir-taddarrujiyy:nth-child(5){ transition-delay:.32s; }
.shabakat-bataqat > .dhahir-taddarrujiyy:nth-child(6){ transition-delay:.4s; }

/* ---------- Scroll progress bar ---------- */
.taqaddum-tamriir{
  position:fixed; top:0; left:0; height:3px; background:linear-gradient(90deg, var(--dhahab), var(--dhahab-ghamiq));
  width:0%; z-index:100; transition:width .1s linear;
}

/* Utility */
.mt-0{margin-top:0} .mb-0{margin-bottom:0}
.text-muted{ color:var(--ink-soft); }
.flex{ display:flex; } .items-center{ align-items:center; } .justify-between{ justify-content:space-between; } .gap-8{ gap:8px; } .gap-14{ gap:14px; }
.badge-dawr{ background:var(--ivory-2); border:1px solid var(--line); padding:3px 10px; border-radius:999px; font-size:.75rem; font-weight:700; color:var(--ink-soft); }
