/* ===================================================================== منصة المكتبة المركزية - جامعة واسط | Global Styles (RTL) ===================================================================== */ @import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800&display=swap'); :root { --primary: #0f5c5c; /* أخضر مزرقّ أكاديمي */ --primary-dark: #0a4444; --primary-light: #e6f2f2; --accent: #c8952f; /* ذهبي */ --accent-dark: #a9781f; --bg: #f4f6f7; --surface: #ffffff; --text: #1c2b2b; --muted: #6b7d7d; --border: #e2e8e8; --danger: #c0392b; --success: #1e8449; --warning: #b9770e; --radius: 12px; --shadow: 0 2px 12px rgba(15, 92, 92, .07); --shadow-lg: 0 8px 30px rgba(15, 92, 92, .12); } [data-theme="dark"] { --bg:#101919;--surface:#182525;--text:#e6efef;--muted:#9bb0b0;--border:#304242;--primary-light:#203838;--primary-dark:#d3eeee;--shadow:0 2px 12px rgba(0,0,0,.25); } [data-theme="dark"] .input,[data-theme="dark"] select,[data-theme="dark"] textarea,[data-theme="dark"] .modal,[data-theme="dark"] .table-card { background:var(--surface);color:var(--text); } [data-theme="dark"] tbody tr:hover { background:#213131; } * { box-sizing: border-box; margin: 0; padding: 0; } html { direction: rtl; } body { font-family: 'Tajawal', system-ui, sans-serif; background: var(--bg); color: var(--text); line-height: 1.6; font-size: 15px; } a { color: var(--primary); text-decoration: none; } a:hover { color: var(--primary-dark); } /* ---------- عناصر عامة ---------- */ .btn { display: inline-flex; align-items: center; gap: 6px; background: var(--primary); color: #fff; border: none; padding: 9px 18px; border-radius: var(--radius); cursor: pointer; font-family: inherit; font-size: 14px; font-weight: 500; transition: .15s; } .btn:hover { background: var(--primary-dark); } .btn.accent { background: var(--accent); } .btn.accent:hover { background: var(--accent-dark); } .btn.ghost { background: transparent; color: var(--primary); border: 1px solid var(--border); } .btn.ghost:hover { background: var(--primary-light); } .btn.danger { background: var(--danger); } .btn.sm { padding: 5px 12px; font-size: 13px; } .btn:disabled { opacity: .5; cursor: not-allowed; } .input, select, textarea { width: 100%; padding: 9px 12px; border: 1px solid var(--border); border-radius: 10px; font-family: inherit; font-size: 14px; background: #fff; color: var(--text); transition: .15s; } .input:focus, select:focus, textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); } label { display: block; font-size: 13px; font-weight: 500; color: var(--muted); margin-bottom: 5px; } .field { margin-bottom: 14px; } .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; } .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; } .card { background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px; border: 1px solid var(--border); } .badge { display: inline-block; padding: 2px 10px; border-radius: 20px; font-size: 12px; font-weight: 500; } .badge.book { background: #e8f0fe; color: #1a5fb4; } .badge.authored { background: #fef3e0; color: #b9770e; } .badge.thesis { background: #e6f7ee; color: #1e8449; } .badge.dissertation { background: #f3e8fd; color: #7d3cb5; } .badge.periodical { background: #fde8ee; color: #b52d5b; } .badge.reference { background: #eef2f4; color: #52657a; } .badge.paper { background: #f0ede6; color: #6b5b3d; } .badge.electronic { background: #e0f2f7; color: #1a7a9c; } .badge.both { background: #e6f2f2; color: var(--primary); } .badge.available { background: #e6f7ee; color: var(--success); } .badge.borrowed { background: #fdecea; color: var(--danger); } .badge.reserved { background: #fef3e0; color: var(--warning); } table { width: 100%; border-collapse: collapse; } th, td { padding: 11px 12px; text-align: right; border-bottom: 1px solid var(--border); font-size: 14px; } th { background: var(--primary-light); color: var(--primary-dark); font-weight: 700; font-size: 13px; } tbody tr:hover { background: #fafcfc; } .muted { color: var(--muted); } .text-danger { color: var(--danger); } .text-success { color: var(--success); } .center { text-align: center; } .flex { display: flex; align-items: center; } .between { justify-content: space-between; } .gap { gap: 10px; } .mt { margin-top: 16px; } .mb { margin-bottom: 16px; } /* ---------- Toast ---------- */ #toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); background: var(--text); color: #fff; padding: 12px 22px; border-radius: 10px; box-shadow: var(--shadow-lg); z-index: 9999; opacity: 0; transition: .3s; pointer-events: none; max-width: 90%; } #toast.show { opacity: 1; } #toast.err { background: var(--danger); } #toast.ok { background: var(--success); } /* ---------- Modal ---------- */ .modal-bg { position: fixed; inset: 0; background: rgba(10, 30, 30, .55); display: none; align-items: flex-start; justify-content: center; z-index: 1000; padding: 40px 16px; overflow-y: auto; } .modal-bg.show { display: flex; } .modal { background: #fff; border-radius: var(--radius); width: 100%; max-width: 620px; box-shadow: var(--shadow-lg); animation: pop .2s; } @keyframes pop { from { transform: scale(.96); opacity: 0; } to { transform: scale(1); opacity: 1; } } .modal-head { padding: 18px 22px; border-bottom: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; } .modal-head h3 { font-size: 18px; color: var(--primary-dark); } .modal-body { padding: 22px; } .modal-foot { padding: 16px 22px; border-top: 1px solid var(--border); display: flex; gap: 10px; justify-content: flex-start; } .close-x { cursor: pointer; font-size: 22px; color: var(--muted); background: none; border: none; } .spinner { border: 3px solid var(--border); border-top-color: var(--primary); border-radius: 50%; width: 28px; height: 28px; animation: spin 1s linear infinite; margin: 30px auto; } @keyframes spin { to { transform: rotate(360deg); } } @media (max-width: 720px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } } .access-tools{position:fixed;left:12px;bottom:12px;z-index:9999;display:flex;gap:5px;padding:6px;background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow)} .access-tools select,.access-tools button{width:auto;padding:6px 8px;font-size:12px} .large-text{font-size:118%}.large-text input,.large-text select,.large-text button,.large-text textarea{font-size:1rem} .high-contrast{filter:contrast(1.25)}.high-contrast *:focus{outline:3px solid #ffbf00!important;outline-offset:2px} .skip-link{position:fixed;top:-60px;right:12px;z-index:10000;background:#000;color:#fff;padding:10px;border-radius:6px}.skip-link:focus{top:10px} [dir="ltr"] .nav a{border-right:0!important;border-left:3px solid transparent}[dir="ltr"] .nav a.active{border-left-color:var(--accent)!important} /* ===================================================================== Wasit Emerald — الهوية البصرية المؤسسية 4.0 ===================================================================== */ :root { --primary:#087f72; --primary-dark:#063f3a; --primary-deep:#032e2b; --primary-light:#e7f7f3; --primary-glow:#31c7b5; --accent:#e4ad38; --accent-dark:#b8790d; --accent-soft:#fff5d8; --bg:#f2f7f6; --surface:#ffffff; --surface-2:#f8fbfa; --text:#142b29; --muted:#637b78; --border:#dce9e6; --danger:#d14949; --success:#15936f; --warning:#c98419; --radius:16px; --radius-lg:24px; --shadow:0 8px 30px rgba(5,67,61,.075); --shadow-lg:0 24px 70px rgba(3,48,44,.18); --ring:0 0 0 4px rgba(8,127,114,.12); } [data-theme="dark"] { --bg:#071512;--surface:#0d201c;--surface-2:#122923;--text:#e8f5f2; --muted:#9bbab4;--border:#23433c;--primary:#31b9a7;--primary-dark:#87e2d5; --primary-deep:#04100e;--primary-light:#153a33;--accent:#f2bd50;--accent-soft:#3a3018; --shadow:0 10px 34px rgba(0,0,0,.28);--shadow-lg:0 28px 80px rgba(0,0,0,.45); } html{scroll-behavior:smooth} body{min-height:100vh;background: radial-gradient(circle at 8% 0%,rgba(49,199,181,.10),transparent 28%), radial-gradient(circle at 92% 18%,rgba(228,173,56,.08),transparent 25%),var(--bg)} body::selection{background:var(--primary);color:#fff} h1,h2,h3,h4{line-height:1.35;letter-spacing:-.015em} a,.btn,.card,.kpi,.stat,.table-card,input,select,textarea{transition:all .22s ease} /* Controls */ .btn{min-height:40px;padding:9px 18px;border-radius:12px;font-weight:700;letter-spacing:.01em; background:linear-gradient(135deg,var(--primary),#0c9d8d);box-shadow:0 7px 18px rgba(8,127,114,.18)} .btn:hover{background:linear-gradient(135deg,#096e65,var(--primary));transform:translateY(-1px);box-shadow:0 10px 25px rgba(8,127,114,.24);color:#fff} .btn:active{transform:translateY(0)} .btn.accent{background:linear-gradient(135deg,var(--accent),#f3c35c);color:#2f260f;box-shadow:0 7px 18px rgba(201,132,25,.18)} .btn.accent:hover{background:linear-gradient(135deg,#d99b21,var(--accent));color:#201807} .btn.ghost{background:rgba(255,255,255,.04);color:var(--primary);border:1px solid var(--border);box-shadow:none} .btn.ghost:hover{background:var(--primary-light);border-color:rgba(8,127,114,.25);color:var(--primary-dark)} .btn.danger{background:linear-gradient(135deg,var(--danger),#e86c62);box-shadow:0 7px 18px rgba(209,73,73,.16)} .btn.sm{min-height:32px;border-radius:10px} .input,select,textarea{min-height:44px;padding:10px 13px;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;color:var(--text)} .input:hover,select:hover,textarea:hover{border-color:rgba(8,127,114,.36)} .input:focus,select:focus,textarea:focus{background:var(--surface);border-color:var(--primary);box-shadow:var(--ring)} label{font-weight:700;color:var(--muted);letter-spacing:.01em} /* Surfaces */ body .card,body .kpi,body .stat,body .table-card,body .advanced{background:linear-gradient(145deg,var(--surface),var(--surface-2));border:1px solid rgba(8,127,114,.10);box-shadow:var(--shadow);border-radius:var(--radius)} body .card:hover,body .kpi:hover,body .stat:hover{border-color:rgba(8,127,114,.22);box-shadow:0 16px 38px rgba(5,67,61,.11)} body .kpi{position:relative;overflow:hidden;padding:20px 21px} body .kpi::after{content:"";position:absolute;width:74px;height:74px;border-radius:50%;left:-24px;top:-28px;background:linear-gradient(135deg,rgba(49,199,181,.14),rgba(228,173,56,.08))} body .kpi .k-num{font-size:30px;color:var(--primary);letter-spacing:-.04em} .badge{padding:4px 11px;border-radius:999px;font-weight:700;border:1px solid transparent} .badge.available{background:#e4f8f0;color:#087658;border-color:#c8eddf}.badge.reference{background:#edf3f7;color:#486578;border-color:#dce8ef} [data-theme="dark"] .badge.available{background:#123d31;color:#76d8b9;border-color:#245c4c} table{border-spacing:0} th{background:linear-gradient(180deg,var(--primary-light),rgba(231,247,243,.45));color:var(--primary-dark);padding:13px 14px} td{padding:12px 14px} tbody tr:hover{background:rgba(8,127,114,.045)} .table-card{overflow:auto}.table-card table{min-width:620px} /* Sidebar and application shell */ body .sidebar{background: radial-gradient(circle at 20% 4%,rgba(49,199,181,.22),transparent 28%), linear-gradient(180deg,#064d46 0%,#032e2b 58%,#021e1c 100%);box-shadow:-12px 0 42px rgba(3,46,43,.13)} body .sidebar::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.055;background-image:linear-gradient(45deg,#fff 1px,transparent 1px),linear-gradient(-45deg,#fff 1px,transparent 1px);background-size:24px 24px} body .sidebar .brand{position:relative;padding:20px 18px;border-bottom:1px solid rgba(255,255,255,.10);font-size:17px} body .sidebar .brand .logo{width:46px;height:46px;border:2px solid rgba(228,173,56,.7);box-shadow:0 7px 22px rgba(0,0,0,.22)} body .nav{position:relative;padding:14px 10px} body .nav a{margin:3px 0;padding:11px 13px;border-radius:11px;color:#c4ddd8;border-right:0} body .nav a:hover{background:rgba(255,255,255,.075);transform:translateX(-2px)} body .nav a.active{background:linear-gradient(90deg,rgba(49,199,181,.20),rgba(228,173,56,.16));color:#fff;border:1px solid rgba(228,173,56,.23);box-shadow:inset 3px 0 0 var(--accent),0 7px 16px rgba(0,0,0,.10)} body .nav .icon{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.07)} body .sidebar .foot{position:relative;color:#91b6af;background:rgba(0,0,0,.10)} body .topbar{background:rgba(255,255,255,.84);backdrop-filter:blur(18px);border-bottom:1px solid rgba(8,127,114,.10);box-shadow:0 7px 25px rgba(5,67,61,.045);padding:15px 26px} [data-theme="dark"] body .topbar{background:rgba(13,32,28,.88)} body .topbar h2{font-size:21px;color:var(--primary-dark)} body .user-chip .avatar{background:linear-gradient(135deg,var(--primary),var(--primary-glow));color:#fff;box-shadow:0 6px 17px rgba(8,127,114,.2);border:2px solid var(--surface)} body .content{padding:28px clamp(16px,3vw,34px)} .tabs{gap:8px;padding:5px;background:var(--surface);border:1px solid var(--border)!important;border-radius:14px;box-shadow:var(--shadow);overflow-x:auto} .tabs button{white-space:nowrap;border:0!important;margin:0!important;border-radius:10px!important;padding:9px 15px!important} .tabs button.active{background:var(--primary-light)!important;color:var(--primary-dark)!important;box-shadow:inset 0 0 0 1px rgba(8,127,114,.10)} /* Modal, toast, loading */ .modal-bg{background:rgba(2,23,20,.66);backdrop-filter:blur(8px)} body .modal{background:var(--surface);border:1px solid rgba(255,255,255,.18);border-radius:22px;overflow:hidden;box-shadow:var(--shadow-lg)} .modal-head{background:linear-gradient(135deg,var(--primary-light),var(--surface));padding:20px 24px} .modal-foot{background:var(--surface-2)} #toast{border-radius:13px;box-shadow:var(--shadow-lg);font-weight:700} .spinner{width:34px;height:34px;border-width:4px;border-top-color:var(--accent);box-shadow:0 0 0 5px rgba(8,127,114,.05)} /* Public catalog and login pages */ body .opac-header{position:relative;overflow:hidden;background: radial-gradient(circle at 12% 15%,rgba(49,199,181,.30),transparent 27%), radial-gradient(circle at 86% 5%,rgba(228,173,56,.24),transparent 24%), linear-gradient(135deg,#075e56,#063f3a 55%,#032c29)} body .opac-header::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.08;background-image:linear-gradient(45deg,#fff 1px,transparent 1px),linear-gradient(-45deg,#fff 1px,transparent 1px);background-size:34px 34px} body .opac-nav,body .hero{position:relative;z-index:1} body .hero{padding:42px 20px 72px} body .hero h1{font-size:clamp(30px,4vw,46px);font-weight:800;text-shadow:0 5px 24px rgba(0,0,0,.15)} body .hero p{font-size:17px;color:#d8eee9} body .hero .hero-logo,body .brand .logo{border:2px solid rgba(228,173,56,.75);box-shadow:0 14px 35px rgba(0,0,0,.23)} body .search-box{max-width:820px;padding:9px;border-radius:19px;background:rgba(255,255,255,.96);box-shadow:0 22px 55px rgba(0,28,26,.30);border:1px solid rgba(255,255,255,.65)} body .stats-row{gap:18px}body .stat{padding:22px}body .stat .num{font-size:30px;color:var(--primary)} body .result-card{border-top:3px solid transparent}body .result-card:hover{border-top-color:var(--accent);transform:translateY(-5px)} body footer{background:linear-gradient(135deg,var(--primary-deep),#063f3a);color:#b9d8d2;border-top:3px solid var(--accent)} body:has(.login-card),body:has(.login){position:relative;overflow:hidden;background: radial-gradient(circle at 15% 18%,rgba(49,199,181,.30),transparent 27%), radial-gradient(circle at 85% 80%,rgba(228,173,56,.24),transparent 25%), linear-gradient(135deg,#032e2b,#07675d)!important} body:has(.login-card)::before,body:has(.login)::before{content:"";position:fixed;inset:0;opacity:.08;background-image:linear-gradient(45deg,#fff 1px,transparent 1px),linear-gradient(-45deg,#fff 1px,transparent 1px);background-size:32px 32px} body .login-card,body .login{position:relative;background:rgba(255,255,255,.96)!important;border:1px solid rgba(255,255,255,.65);border-radius:26px!important;box-shadow:0 30px 85px rgba(0,31,28,.35)!important;backdrop-filter:blur(18px)} body .login-card::before,body .login::before{content:"";position:absolute;top:0;right:0;left:0;height:5px;background:linear-gradient(90deg,var(--primary-glow),var(--accent),var(--primary))} @media(max-width:860px){body .sidebar{width:72px}body .content{padding:18px 12px}body .topbar{padding:12px 14px}.user-chip>div:not(.avatar){display:none}} @media(max-width:600px){body .hero{padding:28px 14px 62px}body .opac-nav{padding:12px}.opac-nav .brand span:last-child{display:none}.search-box{flex-wrap:wrap}.search-wrap{flex-basis:100%}.stats-row{gap:9px!important;padding:0 10px!important}.stat{padding:14px!important}.topbar h2{font-size:17px!important}.user-chip{gap:5px!important}.user-chip .btn{padding:6px 9px}.card{padding:15px}} body>header:not(.opac-header){background:linear-gradient(135deg,var(--primary-deep),#07675d)!important;border-bottom:3px solid var(--accent);box-shadow:0 10px 32px rgba(3,46,43,.16)} body .wrap{padding-top:28px}.kpis .kpi{border-top:3px solid var(--primary-glow)} ::selection{background:var(--primary);color:#fff} /* ===================================================================== ✦ واسط الملكي — Wasit Royal Identity v5.0 ✦ أزرق ملكي عميق + ذهب دافئ | هوية أكاديمية فاخرة تصميم الترقية البصرية — يلغي طبقة «زمرد واسط» السابقة ===================================================================== */ @import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&family=Amiri:wght@700&display=swap'); :root { /* ألوان الهوية الأساسية */ --royal: #12336e; /* أزرق ملكي عميق */ --royal-2: #1b4b9e; /* أزرق ملكي مضيء */ --royal-3: #2f6ad0; /* أزرق سماوي تفاعلي */ --primary: #1b4b9e; --primary-dark: #0d2350; --primary-deep: #081633; --primary-light:#eaf1fc; --primary-glow: #4f8ff0; --ink: #0b1c3d; /* الذهب */ --accent: #d4a437; --accent-2: #f0c559; --accent-dark: #a97c17; --accent-soft: #fdf3d8; --gold-line: linear-gradient(90deg,#a97c17,#f0c559 45%,#fbe9a8 55%,#d4a437); /* أسطح ونصوص */ --bg: #eef2f9; --bg-2: #e6ecf7; --surface: #ffffff; --surface-2: #f6f9ff; --text: #14213d; --muted: #64769a; --border: #dbe4f3; --danger: #d64550; --success: #1c9c6d; --warning: #d69324; --info: #2f6ad0; --radius: 16px; --radius-lg: 26px; --radius-sm: 11px; --shadow: 0 10px 34px rgba(13,35,80,.09); --shadow-lg: 0 30px 80px rgba(8,22,51,.24); --shadow-gold: 0 10px 30px rgba(212,164,55,.28); --ring: 0 0 0 4px rgba(47,106,208,.16); --grad-royal: linear-gradient(135deg,#1b4b9e 0%,#12336e 55%,#0d2350 100%); --grad-royal-soft: linear-gradient(135deg,#2f6ad0,#1b4b9e); --grad-gold: linear-gradient(135deg,#f0c559,#d4a437 55%,#b8860b); } [data-theme="dark"] { --royal:#3f7fe0; --royal-2:#5a95ee; --royal-3:#7db0f7; --primary:#4f8ff0; --primary-dark:#bcd6ff; --primary-deep:#050d1f; --primary-light:#12244a; --primary-glow:#6fa6f7; --accent:#f0c559; --accent-2:#ffd873; --accent-dark:#d4a437; --accent-soft:#33290f; --bg:#060d1c; --bg-2:#08122a; --surface:#0e1a35; --surface-2:#132445; --text:#e8eeff; --muted:#93a6cc; --border:#26365c; --ink:#e8eeff; --shadow:0 12px 38px rgba(0,0,0,.42); --shadow-lg:0 34px 90px rgba(0,0,0,.6); } /* ---------- أساسيات ---------- */ html { scroll-behavior: smooth; } body { font-family:'Tajawal',system-ui,sans-serif; min-height:100vh; background: radial-gradient(circle at 6% -4%, rgba(79,143,240,.16), transparent 30%), radial-gradient(circle at 96% 8%, rgba(212,164,55,.12), transparent 26%), radial-gradient(circle at 50% 120%, rgba(27,75,158,.10), transparent 40%), var(--bg); background-attachment:fixed; } [data-theme="dark"] body { background: radial-gradient(circle at 6% -4%, rgba(79,143,240,.14), transparent 32%), radial-gradient(circle at 96% 8%, rgba(212,164,55,.10), transparent 26%), var(--bg); } ::selection { background: var(--royal-2); color:#fff; } h1,h2,h3,h4 { line-height:1.32; letter-spacing:-.015em; color:var(--ink); } a { color: var(--royal-2); } a:hover { color: var(--royal); } a,.btn,.card,.kpi,.stat,.table-card,.advanced,input,select,textarea,.result-card,.nav a { transition: all .24s cubic-bezier(.34,1.2,.4,1); } /* ---------- أزرار ---------- */ .btn { min-height:42px; padding:10px 20px; border-radius:12px; font-weight:700; letter-spacing:.01em; border:none; color:#fff; background: var(--grad-royal-soft); box-shadow: 0 8px 20px rgba(27,75,158,.22), inset 0 1px 0 rgba(255,255,255,.18); } .btn:hover { background: linear-gradient(135deg,#3f7fe0,#1b4b9e); transform: translateY(-2px); box-shadow: 0 14px 30px rgba(27,75,158,.34), inset 0 1px 0 rgba(255,255,255,.22); color:#fff; } .btn:active { transform: translateY(0); } .btn.accent { background: var(--grad-gold); color:#3a2c06; box-shadow: var(--shadow-gold), inset 0 1px 0 rgba(255,255,255,.4); } .btn.accent:hover { background: linear-gradient(135deg,#ffd873,#d4a437); color:#2e2205; box-shadow: 0 14px 34px rgba(212,164,55,.4); } .btn.ghost { background: rgba(27,75,158,.05); color: var(--royal-2); border: 1.5px solid var(--border); box-shadow:none; } .btn.ghost:hover { background: var(--primary-light); border-color: rgba(47,106,208,.4); color: var(--royal); transform: translateY(-1px); } .btn.danger { background: linear-gradient(135deg,#e0616b,#d64550); box-shadow:0 8px 20px rgba(214,69,80,.24); } .btn.sm { min-height:34px; padding:6px 14px; border-radius:10px; font-size:13px; } .btn:disabled { opacity:.5; cursor:not-allowed; transform:none; } /* ---------- حقول الإدخال ---------- */ .input, select, textarea { min-height:46px; padding:11px 14px; border-radius:12px; background: var(--surface-2); border:1.5px solid var(--border); color:var(--text); } .input:hover, select:hover, textarea:hover { border-color: rgba(47,106,208,.4); } .input:focus, select:focus, textarea:focus { outline:none; background:var(--surface); border-color: var(--royal-2); box-shadow: var(--ring); } label { font-weight:700; color:var(--muted); letter-spacing:.01em; } /* ---------- بطاقات وأسطح ---------- */ body .card, body .table-card, body .advanced { background: linear-gradient(158deg, var(--surface), var(--surface-2)); border:1px solid rgba(27,75,158,.10); box-shadow: var(--shadow); border-radius: var(--radius); } body .card:hover, body .table-card:hover { border-color: rgba(47,106,208,.24); box-shadow: 0 20px 46px rgba(13,35,80,.13); } /* KPI فاخرة */ body .kpi { position:relative; overflow:hidden; padding:22px 22px 20px; background: linear-gradient(158deg, var(--surface), var(--surface-2)); border:1px solid rgba(27,75,158,.10); border-radius: var(--radius); box-shadow: var(--shadow); border-top:none; } body .kpi::before { content:""; position:absolute; inset:0 0 auto 0; height:4px; background: var(--grad-gold); opacity:.9; } body .kpi::after { content:""; position:absolute; width:90px; height:90px; border-radius:50%; left:-30px; top:-34px; background: radial-gradient(circle, rgba(79,143,240,.22), rgba(212,164,55,.10) 60%, transparent 72%); } body .kpi:hover { transform: translateY(-4px); border-color: rgba(47,106,208,.26); box-shadow:0 22px 50px rgba(13,35,80,.16); } body .kpi .k-num { font-size:32px; font-weight:900; letter-spacing:-.04em; background: var(--grad-royal-soft); -webkit-background-clip:text; background-clip:text; color:transparent; } body .kpi.warn .k-num { background: linear-gradient(135deg,#e6a83a,#d69324); -webkit-background-clip:text; background-clip:text; color:transparent; } body .kpi.danger .k-num { background: linear-gradient(135deg,#e0616b,#d64550); -webkit-background-clip:text; background-clip:text; color:transparent; } body .kpi .k-lbl { color:var(--muted); font-weight:600; margin-top:5px; } /* ---------- الشارات (Badges) ---------- */ .badge { padding:4px 12px; border-radius:999px; font-weight:700; font-size:12px; border:1px solid transparent; } .badge.book { background:#e7effe; color:#1a4fb4; border-color:#cfe0fb; } .badge.authored { background:#fdf1da; color:#a97c17; border-color:#f4e2b8; } .badge.thesis { background:#e2f6ee; color:#128063; border-color:#c6ecdd; } .badge.dissertation{ background:#efe8fd; color:#6b3cc9; border-color:#ddd0f8; } .badge.periodical { background:#fde8ef; color:#c02f62; border-color:#f8cfdc; } .badge.reference { background:#eaf0f8; color:#465f80; border-color:#d6e2f1; } .badge.paper { background:#f1ede2; color:#6b5b3d; border-color:#e4dcc7; } .badge.electronic { background:#e0f0fa; color:#1a6f9c; border-color:#c6e4f3; } .badge.both { background:#e7effe; color:var(--royal-2); border-color:#cfe0fb; } .badge.available { background:#e2f6ee; color:#0f8a5f; border-color:#c6ecdd; } .badge.borrowed { background:#fde7e9; color:#d64550; border-color:#f7ccd0; } .badge.reserved { background:#fdf1da; color:#c07f16; border-color:#f4e2b8; } [data-theme="dark"] .badge { filter: brightness(1.05); } [data-theme="dark"] .badge.book{background:#132d5c;color:#8fb6ff;border-color:#25467e} [data-theme="dark"] .badge.available{background:#123d31;color:#71d8b3;border-color:#245c4c} [data-theme="dark"] .badge.borrowed{background:#3f1b20;color:#f2a3aa;border-color:#5e2b31} [data-theme="dark"] .badge.reserved{background:#3a2f12;color:#eecb7a;border-color:#5a4a1e} /* ---------- الجداول ---------- */ table { border-spacing:0; } th { background: linear-gradient(180deg, var(--primary-light), rgba(234,241,252,.4)); color: var(--royal); font-weight:800; padding:14px; font-size:13px; border-bottom:2px solid rgba(27,75,158,.12); } td { padding:13px 14px; } tbody tr { transition: background .18s; } tbody tr:hover { background: rgba(47,106,208,.05); } [data-theme="dark"] th { background: linear-gradient(180deg,#132445,#0e1a35); color:#9fbdff; } [data-theme="dark"] tbody tr:hover { background: rgba(79,143,240,.08); } .table-card { overflow:auto; } .table-card table { min-width:620px; } /* ---------- التبويبات ---------- */ .tabs { gap:8px; padding:6px; background:var(--surface); border:1px solid var(--border)!important; border-radius:14px; box-shadow:var(--shadow); overflow-x:auto; border-bottom:1px solid var(--border)!important; } .tabs button { white-space:nowrap; border:0!important; margin:0!important; border-radius:10px!important; padding:9px 16px!important; color:var(--muted); font-weight:700; } .tabs button.active { background: var(--grad-royal-soft)!important; color:#fff!important; box-shadow:0 6px 16px rgba(27,75,158,.26)!important; border-bottom:0!important; } /* ===================================================================== الشريط الجانبي وهيكل التطبيق ===================================================================== */ body .sidebar { background: radial-gradient(circle at 24% 3%, rgba(79,143,240,.28), transparent 30%), radial-gradient(circle at 80% 100%, rgba(212,164,55,.12), transparent 34%), linear-gradient(180deg, #12336e 0%, #0d2350 55%, #081633 100%); box-shadow: -14px 0 46px rgba(8,22,51,.2); position: sticky; top:0; height:100vh; } body .sidebar::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.06; background-image: linear-gradient(45deg,#fff 1px,transparent 1px), linear-gradient(-45deg,#fff 1px,transparent 1px); background-size:26px 26px; } body .sidebar .brand { position:relative; padding:22px 18px; font-size:16px; border-bottom:1px solid rgba(255,255,255,.09); } body .sidebar .brand::after { content:""; position:absolute; bottom:-1px; right:0; left:0; height:2px; background: var(--gold-line); opacity:.6; } body .sidebar .brand .logo { width:48px; height:48px; background:#fff; border-radius:50%; border:2px solid rgba(212,164,55,.85); box-shadow:0 8px 24px rgba(0,0,0,.28), 0 0 0 4px rgba(212,164,55,.12); } body .sidebar .brand small { color:#9fc0f0!important; } body .nav { position:relative; padding:14px 10px; } body .nav a { margin:3px 0; padding:11px 14px; border-radius:12px; color:#c3d5f2; font-weight:600; border-right:0; position:relative; } body .nav a:hover { background: rgba(255,255,255,.07); color:#fff; transform: translateX(-3px); } body .nav a.active { background: linear-gradient(90deg, rgba(79,143,240,.28), rgba(212,164,55,.14)); color:#fff; font-weight:700; box-shadow: inset 3px 0 0 var(--accent), 0 8px 18px rgba(0,0,0,.14); border:1px solid rgba(212,164,55,.22); } body .nav a.active .icon { background: rgba(212,164,55,.22); } body .nav .icon { width:30px; height:30px; display:grid; place-items:center; border-radius:9px; background: rgba(255,255,255,.06); font-size:16px; } body .sidebar .foot { position:relative; padding:14px 18px; color:#8fb0e0; background: rgba(0,0,0,.14); border-top:1px solid rgba(255,255,255,.07); font-size:12px; } /* الشريط العلوي */ body .topbar { background: rgba(255,255,255,.82); backdrop-filter: blur(20px); border-bottom:1px solid rgba(27,75,158,.1); box-shadow: 0 8px 26px rgba(13,35,80,.05); padding:15px 26px; } [data-theme="dark"] body .topbar { background: rgba(14,26,53,.86); } body .topbar h2 { font-size:22px; color: var(--royal); font-weight:800; } body .user-chip .avatar { width:38px; height:38px; border-radius:50%; background: var(--grad-royal-soft); color:#fff; font-weight:800; box-shadow:0 6px 18px rgba(27,75,158,.28); border:2px solid var(--surface); } body .content { padding:28px clamp(16px,3vw,34px); } /* ===================================================================== النوافذ المنبثقة والتنبيهات ===================================================================== */ .modal-bg { background: rgba(6,16,38,.62); backdrop-filter: blur(9px); } body .modal { background: var(--surface); border:1px solid rgba(255,255,255,.16); border-radius:22px; overflow:hidden; box-shadow: var(--shadow-lg); } .modal-head { background: linear-gradient(135deg, var(--primary-light), var(--surface)); padding:20px 24px; border-bottom:1px solid var(--border); position:relative; } .modal-head::after { content:""; position:absolute; bottom:0; right:0; left:0; height:2px; background: var(--gold-line); opacity:.5; } .modal-head h3 { color: var(--royal); } .modal-foot { background: var(--surface-2); } #toast { border-radius:13px; box-shadow: var(--shadow-lg); font-weight:700; background: var(--ink); } #toast.ok { background: linear-gradient(135deg,#1c9c6d,#158055); } #toast.err { background: linear-gradient(135deg,#e0616b,#d64550); } .spinner { width:36px; height:36px; border-width:4px; border-color: rgba(47,106,208,.16); border-top-color: var(--accent); box-shadow: 0 0 0 5px rgba(27,75,158,.04); } /* ===================================================================== الفهرس العام (OPAC) ===================================================================== */ body .opac-header { position:relative; overflow:hidden; color:#fff; background: radial-gradient(circle at 14% 12%, rgba(79,143,240,.34), transparent 28%), radial-gradient(circle at 88% 4%, rgba(212,164,55,.26), transparent 26%), linear-gradient(135deg, #1b4b9e 0%, #12336e 52%, #0d2350 100%); } body .opac-header::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.07; background-image: linear-gradient(45deg,#fff 1px,transparent 1px), linear-gradient(-45deg,#fff 1px,transparent 1px); background-size:36px 36px; } body .opac-header::before { content:""; position:absolute; bottom:0; right:0; left:0; height:3px; background: var(--gold-line); z-index:2; } body .opac-nav, body .hero { position:relative; z-index:1; } body .opac-nav .brand .logo, body .hero .hero-logo { border:2.5px solid rgba(212,164,55,.85); box-shadow:0 12px 34px rgba(0,0,0,.28), 0 0 0 5px rgba(212,164,55,.1); } body .hero { padding:44px 20px 78px; } body .hero h1 { font-family:'Amiri','Tajawal',serif; font-weight:700; font-size:clamp(32px,4.4vw,52px); color:#fff; text-shadow:0 6px 28px rgba(0,0,0,.28); letter-spacing:0; } body .hero h1 .grad-gold, body .hero .accent-word { background: linear-gradient(135deg,#ffe28a,#f0c559 50%,#d4a437); -webkit-background-clip:text; background-clip:text; color:transparent; } body .hero p { font-size:17px; color:#cfe0f8; max-width:640px; margin:0 auto; } body .search-box { max-width:840px; margin:28px auto 0; padding:9px; border-radius:19px; background: rgba(255,255,255,.97); box-shadow:0 26px 60px rgba(6,20,48,.34), inset 0 0 0 1px rgba(255,255,255,.5); border:1px solid rgba(255,255,255,.6); } [data-theme="dark"] body .search-box { background: rgba(19,36,69,.96); } body .search-box input { color: var(--text); background: transparent; } /* شريط الإحصاءات */ body .stats-row { gap:18px; } body .stat { position:relative; overflow:hidden; padding:24px 20px; text-align:center; background: linear-gradient(158deg,var(--surface),var(--surface-2)); border:1px solid rgba(27,75,158,.1); border-radius: var(--radius); box-shadow: var(--shadow); } body .stat::before { content:""; position:absolute; inset:0 0 auto 0; height:3px; background: var(--grad-gold); } body .stat:hover { transform: translateY(-4px); box-shadow:0 20px 44px rgba(13,35,80,.14); } body .stat .num { font-size:30px; font-weight:900; background: var(--grad-royal-soft); -webkit-background-clip:text; background-clip:text; color:transparent; } body .stat .lbl { color:var(--muted); font-weight:600; } /* بطاقات النتائج */ body .result-card { border:1px solid rgba(27,75,158,.1); border-top:3px solid transparent; background: linear-gradient(158deg,var(--surface),var(--surface-2)); box-shadow: var(--shadow); border-radius: var(--radius); } body .result-card:hover { border-top-color: var(--accent); transform: translateY(-6px); box-shadow:0 24px 54px rgba(13,35,80,.17); } body .result-card h3 { color: var(--royal); } .result-cover { background: var(--primary-light); box-shadow:0 4px 14px rgba(13,35,80,.12); } .stars { color: var(--accent); } /* الفوتر */ body footer { background: linear-gradient(135deg, var(--primary-deep), #0d2350); color:#a9c2ea; border-top:3px solid transparent; border-image: var(--gold-line) 1; position:relative; } /* ===================================================================== صفحات تسجيل الدخول ===================================================================== */ body:has(.login-card), body:has(.login) { position:relative; overflow:hidden; background: radial-gradient(circle at 16% 20%, rgba(79,143,240,.34), transparent 28%), radial-gradient(circle at 84% 82%, rgba(212,164,55,.26), transparent 26%), linear-gradient(135deg, #0d2350, #12336e 45%, #1b4b9e)!important; } body:has(.login-card)::before, body:has(.login)::before { content:""; position:fixed; inset:0; opacity:.07; pointer-events:none; background-image: linear-gradient(45deg,#fff 1px,transparent 1px), linear-gradient(-45deg,#fff 1px,transparent 1px); background-size:34px 34px; } /* هالات ضوئية عائمة خلف بطاقة الدخول */ body:has(.login-card)::after, body:has(.login)::after { content:""; position:fixed; width:520px; height:520px; border-radius:50%; top:-140px; left:-120px; pointer-events:none; z-index:0; background: radial-gradient(circle, rgba(212,164,55,.16), transparent 66%); animation: floatGlow 9s ease-in-out infinite alternate; } @keyframes floatGlow { from{ transform:translate(0,0) } to{ transform:translate(60px,50px) } } body .login-card, body .login { position:relative; z-index:2; background: rgba(255,255,255,.98)!important; border:1px solid rgba(255,255,255,.6); border-radius:26px!important; box-shadow:0 34px 90px rgba(6,20,48,.4), inset 0 0 0 1px rgba(255,255,255,.4)!important; backdrop-filter: blur(20px); } [data-theme="dark"] body .login-card, [data-theme="dark"] body .login { background: rgba(14,26,53,.97)!important; } body .login-card::before, body .login::before { content:""; position:absolute; top:0; right:0; left:0; height:5px; background: var(--gold-line); border-radius:26px 26px 0 0; } body .login-logo h1 { color: var(--royal); } body .login-logo .icon, body .login .logo { box-shadow:0 10px 30px rgba(13,35,80,.18), 0 0 0 4px rgba(212,164,55,.12); border-radius:50%; } /* رأس صفحة المستفيد */ body > header:not(.opac-header) { background: radial-gradient(circle at 90% 0%, rgba(212,164,55,.18), transparent 40%), linear-gradient(135deg, var(--primary-deep), #1b4b9e)!important; border-bottom:3px solid transparent; border-image: var(--gold-line) 1; box-shadow:0 10px 32px rgba(8,22,51,.18); } body .wrap { padding-top:28px; } .kpis .kpi { border-top:0; } /* أدوات الوصول */ .access-tools { background: var(--surface); border:1px solid var(--border); box-shadow: var(--shadow); border-radius:12px; } /* ظهور متدرّج للمحتوى */ @keyframes riseIn { from{ opacity:0; transform: translateY(14px) } to{ opacity:1; transform:none } } body .content > *, body .container .results > *, .kpi, .stat { animation: riseIn .5s ease both; } /* استجابة الشاشات */ @media (max-width:860px){ body .sidebar { width:72px; } body .content { padding:18px 12px; } body .topbar { padding:12px 14px; } .user-chip > div:not(.avatar){ display:none; } } @media (max-width:600px){ body .hero { padding:30px 14px 66px; } body .hero h1 { font-size:clamp(26px,7vw,34px); } .search-box { flex-wrap:wrap; } .search-wrap { flex-basis:100%; } .stats-row { gap:10px!important; } .stat { padding:16px!important; } } /* ===================================================================== Wasit Spectrum UI v6.0 — واجهة متعددة الألوان بهوية جامعة واسط ===================================================================== */ :root{ --wasit-blue:#0b63ce; --wasit-blue-dark:#073d85; --wasit-green:#079b68; --wasit-green-dark:#046145; --wasit-gold:#f2b705; --wasit-orange:#ef8a17; --wasit-purple:#7b43d6; --wasit-cyan:#0aa6b7; --wasit-red:#d84b62; } body{background: radial-gradient(circle at 8% 10%,rgba(11,99,206,.08),transparent 26%), radial-gradient(circle at 88% 4%,rgba(7,155,104,.10),transparent 26%), radial-gradient(circle at 55% 100%,rgba(242,183,5,.08),transparent 30%), #f3f7fb} /* public catalog hero */ body .opac-header{ position:relative;overflow:hidden; background: linear-gradient(90deg,rgba(4,45,74,.93),rgba(3,91,73,.88) 58%,rgba(7,66,112,.90)), url('/img/wasit-campus.jpg') center 46%/cover no-repeat!important; min-height:330px;border-bottom:5px solid var(--wasit-gold) } body .opac-header::before{ content:"";position:absolute;inset:auto -8% -55px -8%;height:120px; background:linear-gradient(100deg,var(--wasit-gold) 0 31%,var(--wasit-green) 31% 63%,var(--wasit-blue) 63% 100%); transform:rotate(-2deg);opacity:.95;z-index:0 } body .opac-header::after{background:none!important} body .opac-nav{max-width:1320px;padding:16px 28px} body .opac-nav .brand{font-size:20px;text-shadow:0 2px 12px rgba(0,0,0,.28)} body .brand .logo{width:64px!important;height:64px!important;padding:2px!important;border:3px solid #fff!important;box-shadow:0 8px 24px rgba(0,0,0,.25)!important} body .hero{padding:30px 20px 92px!important} body .hero .hero-logo{width:128px!important;height:128px!important;padding:2px!important;border:4px solid #fff!important;box-shadow:0 15px 45px rgba(0,0,0,.35)!important} body .hero h1{font-size:clamp(34px,4.4vw,56px)!important;color:#fff} body .hero h1 .accent-word{color:var(--wasit-gold);text-shadow:0 2px 10px rgba(0,0,0,.25)} body .hero p{font-size:18px!important;color:#fff!important;font-weight:600} body .search-box{border:2px solid rgba(255,255,255,.75);box-shadow:0 24px 70px rgba(0,28,62,.34)!important} body .search-box .btn.accent{background:linear-gradient(135deg,var(--wasit-green),#10bc7f)!important;color:#fff!important} /* multi-colour statistic cards */ body .stats-row{max-width:1040px;margin-top:-42px!important} body .stats-row .stat{position:relative;overflow:hidden;border:0!important;border-radius:20px!important} body .stats-row .stat::before{content:"";position:absolute;inset:0 0 auto 0;height:5px} body .stats-row .stat:nth-child(1)::before{background:var(--wasit-green)} body .stats-row .stat:nth-child(2)::before{background:var(--wasit-blue)} body .stats-row .stat:nth-child(3)::before{background:var(--wasit-orange)} body .stats-row .stat:nth-child(4)::before{background:var(--wasit-purple)} body .stats-row .stat:nth-child(1) .num{color:var(--wasit-green)!important} body .stats-row .stat:nth-child(2) .num{color:var(--wasit-blue)!important} body .stats-row .stat:nth-child(3) .num{color:var(--wasit-orange)!important} body .stats-row .stat:nth-child(4) .num{color:var(--wasit-purple)!important} /* colorful actions */ .wasit-service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:10px 0 28px} .wasit-service-card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--border);border-radius:20px;padding:20px;box-shadow:var(--shadow);min-height:150px} .wasit-service-card .service-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;font-size:26px;margin-bottom:12px;color:#fff} .wasit-service-card h3{font-size:17px;margin-bottom:5px}.wasit-service-card p{font-size:13px;color:var(--muted)} .wasit-service-card:nth-child(1){background:linear-gradient(145deg,#f3fbf7,#fff)} .wasit-service-card:nth-child(1) .service-icon{background:linear-gradient(135deg,var(--wasit-green),#20c48b)} .wasit-service-card:nth-child(2){background:linear-gradient(145deg,#f2f7ff,#fff)} .wasit-service-card:nth-child(2) .service-icon{background:linear-gradient(135deg,var(--wasit-blue),#388cf1)} .wasit-service-card:nth-child(3){background:linear-gradient(145deg,#fff8eb,#fff)} .wasit-service-card:nth-child(3) .service-icon{background:linear-gradient(135deg,var(--wasit-orange),var(--wasit-gold))} .wasit-service-card:nth-child(4){background:linear-gradient(145deg,#f8f3ff,#fff)} .wasit-service-card:nth-child(4) .service-icon{background:linear-gradient(135deg,var(--wasit-purple),#a66df0)} /* admin dashboard identity */ body .sidebar{background:linear-gradient(180deg,#072e5a 0%,#063e4a 47%,#064b38 100%)!important;border-left:1px solid rgba(255,255,255,.08)} body .sidebar .brand{padding:16px 14px!important;border-bottom:3px solid var(--wasit-gold)!important} body .sidebar .brand .logo{width:52px!important;height:52px!important} body .nav a.active{background:linear-gradient(90deg,rgba(242,183,5,.18),rgba(11,99,206,.10))!important;border-right-color:var(--wasit-gold)!important} body .topbar{background:rgba(255,255,255,.95)!important;backdrop-filter:blur(16px);box-shadow:0 5px 24px rgba(22,50,75,.07)} body .kpi-grid .kpi:nth-child(6n+1){border-top:4px solid var(--wasit-green)!important} body .kpi-grid .kpi:nth-child(6n+2){border-top:4px solid var(--wasit-blue)!important} body .kpi-grid .kpi:nth-child(6n+3){border-top:4px solid var(--wasit-orange)!important} body .kpi-grid .kpi:nth-child(6n+4){border-top:4px solid var(--wasit-purple)!important} body .kpi-grid .kpi:nth-child(6n+5){border-top:4px solid var(--wasit-cyan)!important} body .kpi-grid .kpi:nth-child(6n+6){border-top:4px solid var(--wasit-red)!important} /* login & registration use campus background */ body:has(.login-card),body:has(.login),body:has(.box){ background: linear-gradient(120deg,rgba(4,45,74,.88),rgba(4,107,76,.80)), url('/img/wasit-campus.jpg') center/cover fixed no-repeat!important } body .login-card,body .login,body .box{background:rgba(255,255,255,.96)!important;backdrop-filter:blur(18px)} body .login-logo .icon,body .login .logo{filter:drop-shadow(0 9px 20px rgba(0,0,0,.16))} /* member portal header */ .member-brand-header{background: linear-gradient(100deg,rgba(4,45,74,.95),rgba(5,124,87,.91)), url('/img/wasit-campus.jpg') center/cover!important;border-bottom:4px solid var(--wasit-gold)!important} .member-brand-inner{max-width:1120px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:14px} .member-brand-title{display:flex;align-items:center;gap:12px}.member-brand-title img{width:58px;height:58px;object-fit:contain;background:#fff;border-radius:50%;padding:2px;box-shadow:0 6px 18px rgba(0,0,0,.24)} /* footer */ body footer{background:linear-gradient(90deg,#06284d,#064b3a 56%,#073b6b)!important;border-top:4px solid var(--wasit-gold)!important;color:#e7f3ff!important} @media(max-width:900px){.wasit-service-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:600px){.wasit-service-grid{grid-template-columns:1fr}.member-brand-title img{width:48px;height:48px}.member-brand-title span{font-size:14px}.opac-nav .flex.gap{gap:5px;flex-wrap:wrap;justify-content:flex-end}.opac-nav .btn{padding:6px 9px;font-size:11px}} /* ===================================================================== Wasit Living Spectrum v6.1 — دخول موحد فوق الفهرس + لمسات تفاعلية ===================================================================== */ .opac-header{isolation:isolate} .opac-header .opac-nav,.opac-header .hero{position:relative;z-index:2} .opac-header:has(.hero)::selection{background:rgba(242,183,5,.35)} .opac-header .hero::before,.opac-header .hero::after{content:"";position:absolute;border-radius:999px;filter:blur(2px);pointer-events:none;z-index:-1;opacity:.55} .opac-header .hero::before{width:260px;height:260px;background:radial-gradient(circle,rgba(0,224,167,.32),transparent 66%);top:-80px;right:8%;animation:wasitOrbA 8s ease-in-out infinite alternate} .opac-header .hero::after{width:320px;height:320px;background:radial-gradient(circle,rgba(60,135,255,.28),transparent 68%);left:4%;bottom:-160px;animation:wasitOrbB 10s ease-in-out infinite alternate} @keyframes wasitOrbA{to{transform:translate(-38px,30px) scale(1.12)}} @keyframes wasitOrbB{to{transform:translate(54px,-24px) scale(.92)}} .hero-logo{animation:logoFloat 4.8s ease-in-out infinite;position:relative} @keyframes logoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}} .portal-main-btn{border:0!important;color:#072e5a!important;background:linear-gradient(135deg,#fff,#fff4c7)!important;box-shadow:0 9px 26px rgba(0,0,0,.18);font-weight:900!important} .portal-catalog-btn{color:#fff!important;border:1px solid rgba(255,255,255,.6)!important;background:rgba(255,255,255,.10)!important;backdrop-filter:blur(8px)} .portal-main-btn:hover,.portal-catalog-btn:hover{transform:translateY(-2px) scale(1.02)} .live-status{position:relative;z-index:7;margin:-19px auto 0;padding:0 18px} .live-status-inner{max-width:980px;margin:auto;min-height:42px;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border:1px solid rgba(11,99,206,.12);box-shadow:0 12px 34px rgba(13,35,80,.13);border-radius:999px;padding:8px 16px;color:#27405d;font-size:12px} .live-status-inner button{border:0;background:transparent;color:var(--wasit-blue);font:inherit;font-weight:800;cursor:pointer;padding:4px 7px;border-radius:999px}.live-status-inner button:hover{background:#edf5ff} .live-dot{width:9px;height:9px;border-radius:50%;background:#18b875;box-shadow:0 0 0 5px rgba(24,184,117,.12);animation:livePulse 1.8s ease-out infinite}.live-sep{opacity:.35} @keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(24,184,117,.35)}70%{box-shadow:0 0 0 8px rgba(24,184,117,0)}100%{box-shadow:0 0 0 0 rgba(24,184,117,0)}} .wasit-service-card{transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s,border-color .28s}.wasit-service-card::after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;left:-36px;bottom:-42px;background:currentColor;opacity:.04;transition:transform .35s} .wasit-service-card:hover{transform:translateY(-8px) rotateX(1deg);box-shadow:0 24px 54px rgba(18,49,88,.16);border-color:rgba(11,99,206,.2)}.wasit-service-card:hover::after{transform:scale(1.7)} .result-card{transition:transform .25s ease,box-shadow .25s ease!important} body.portal-open{overflow:hidden} .portal-modal-bg{position:fixed;inset:0;z-index:1200;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(4,18,40,.68);backdrop-filter:blur(12px);opacity:0;transition:opacity .2s} .portal-modal-bg.show{display:flex;opacity:1;animation:portalFade .2s ease} @keyframes portalFade{from{opacity:0}to{opacity:1}} .portal-shell{width:min(1040px,96vw);max-height:min(840px,92vh);overflow:auto;display:grid;grid-template-columns:330px 1fr;background:rgba(255,255,255,.98);border:1px solid rgba(255,255,255,.72);border-radius:30px;box-shadow:0 35px 100px rgba(0,13,39,.46);position:relative;animation:portalRise .32s cubic-bezier(.2,.9,.2,1)} @keyframes portalRise{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}} .portal-close{position:absolute;top:12px;left:14px;z-index:4;width:38px;height:38px;border:0;border-radius:50%;background:rgba(7,30,64,.08);font-size:28px;line-height:1;cursor:pointer;color:#173653}.portal-close:hover{background:#fff1f1;color:#b62f43;transform:rotate(5deg)} .portal-brand-panel{padding:42px 28px;color:#fff;background:linear-gradient(160deg,rgba(5,48,92,.97),rgba(5,117,83,.95)),url('/img/wasit-campus.jpg') center/cover;border-radius:0 30px 30px 0;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden} .portal-brand-panel::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:rgba(242,183,5,.16);left:-80px;bottom:-90px} .portal-brand-panel img{width:132px;height:132px;object-fit:contain;background:#fff;border-radius:50%;padding:3px;border:4px solid rgba(255,255,255,.92);box-shadow:0 16px 36px rgba(0,0,0,.3);margin-bottom:18px}.portal-brand-panel h2{font-size:27px;margin-bottom:8px}.portal-brand-panel p{opacity:.9;line-height:1.8}.portal-brand-points{display:grid;gap:9px;width:100%;margin:24px 0;text-align:right}.portal-brand-points span{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);border-radius:13px;padding:9px 12px;font-size:13px}.portal-back-catalog{margin-top:auto;width:100%;border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.1);color:#fff;padding:11px;border-radius:12px;cursor:pointer;font:inherit;font-weight:800} .portal-form-panel{padding:36px 38px}.portal-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:#f0f5fa;border-radius:15px;padding:6px;margin-bottom:26px}.portal-tabs button{border:0;background:transparent;padding:11px 8px;border-radius:11px;font:inherit;font-weight:800;color:#5b6d82;cursor:pointer}.portal-tabs button.active{background:#fff;color:var(--wasit-blue);box-shadow:0 4px 14px rgba(12,54,102,.11)} .portal-pane{display:none}.portal-pane.active{display:block;animation:portalPane .25s ease}@keyframes portalPane{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}.portal-pane h3{font-size:24px;color:#113d71;margin-bottom:5px}.portal-pane>.muted{margin-bottom:22px}.portal-submit{width:100%;justify-content:center;min-height:46px;margin-top:4px;font-weight:900}.portal-err{min-height:22px;color:#c52f46;text-align:center;margin-top:8px;font-size:13px}.portal-alt-link{display:block;text-align:center;margin-top:12px;font-size:12px;color:var(--muted)} .portal-register-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.portal-consent{display:flex;align-items:flex-start;gap:8px;background:#f6faf8;border:1px solid #d9eee4;border-radius:12px;padding:10px 12px;font-size:12px;line-height:1.7;margin-bottom:8px}.portal-consent input{margin-top:4px}.portal-msg{text-align:center;margin-top:10px;font-size:13px}.portal-msg.ok{color:#08764e;background:#edf9f4;border-radius:12px;padding:10px}.portal-msg.err{color:#b7283d} [data-theme="dark"] .portal-shell{background:#111f35;color:#eef6ff}.portal-shell .field label{font-weight:700}.portal-shell input,.portal-shell select{border-radius:12px} @media(max-width:780px){.portal-shell{grid-template-columns:1fr}.portal-brand-panel{display:none}.portal-form-panel{padding:52px 20px 24px}.portal-tabs{grid-template-columns:1fr}.portal-register-grid{grid-template-columns:1fr}.portal-close{background:#edf3f8}.live-status{margin-top:-12px}.live-status-inner{border-radius:18px}.live-sep{display:none}} @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}} /* v6.2 Full bilingual direction support */ html[dir="ltr"] body{text-align:left;} html[dir="ltr"] .sidebar,html[dir="ltr"] .modal,html[dir="ltr"] .card,html[dir="ltr"] .field,html[dir="ltr"] table{text-align:left;} html[dir="ltr"] .result-cover{float:left!important;margin-left:0!important;margin-right:12px!important;} html[dir="ltr"] .suggestions,html[dir="ltr"] .suggestions button{text-align:left!important;} html[dir="ltr"] .portal-modal,html[dir="ltr"] .portal-panel{text-align:left;} html[dir="ltr"] input,html[dir="ltr"] textarea,html[dir="ltr"] select{text-align:left;} html[dir="ltr"] .access-tools{direction:ltr;} /* v6.4 radiant university identity */ body .opac-nav .brand .logo,body .hero .hero-logo{background:transparent!important;border:0!important;box-shadow:none!important} body .opac-nav .brand .logo{width:58px!important;height:58px!important;padding:0!important} body .hero .hero-logo{width:118px!important;height:118px!important;padding:0!important} /* ===================================================================== v7.0 — Executive Work Center & Data Quality ===================================================================== */ .hero-panel{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 30px;margin-bottom:26px;border-radius:24px;color:#fff;background:radial-gradient(circle at 12% 10%,rgba(255,255,255,.14),transparent 32%),linear-gradient(135deg,var(--primary-deep),#075d54 58%,#0a8779);box-shadow:0 24px 60px rgba(3,48,44,.18);overflow:hidden;position:relative} .hero-panel:after{content:"";position:absolute;width:260px;height:260px;border:1px solid rgba(255,255,255,.1);border-radius:50%;left:-100px;bottom:-180px} .hero-panel h1{font-size:clamp(22px,3vw,34px);margin:5px 0 8px;color:#fff}.hero-panel p{color:#d7eeea;max-width:680px}.eyebrow{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.08em;color:var(--accent);text-transform:uppercase}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1}.hero-panel .btn.ghost{color:#fff;border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.06)}.hero-panel .btn.ghost:hover{background:rgba(255,255,255,.14)} .section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:24px 0 14px}.section-head h3{font-size:19px;color:var(--primary-dark);margin:0}.section-head p{font-size:13px;color:var(--muted);margin:4px 0 0}.section-head.compact{margin:0 0 16px;align-items:center}.priority-pill,.scope-chip{display:inline-flex;padding:7px 12px;border-radius:999px;font-size:12px;font-weight:800;background:var(--accent-soft);color:var(--accent-dark);border:1px solid rgba(228,173,56,.25)}.scope-chip{background:var(--primary-light);color:var(--primary);border-color:rgba(8,127,114,.18)} .work-grid{display:grid;grid-template-columns:repeat(6,minmax(125px,1fr));gap:12px}.work-action{border:1px solid var(--border);border-radius:18px;background:var(--surface);padding:18px 12px;text-align:center;color:var(--text);cursor:pointer;box-shadow:var(--shadow);font-family:inherit;transition:.2s}.work-action:hover{transform:translateY(-3px);border-color:rgba(8,127,114,.35);box-shadow:0 15px 35px rgba(5,67,61,.12)}.work-action>span{display:grid;place-items:center;width:38px;height:38px;margin:0 auto 8px;border-radius:12px;background:var(--primary-light);font-size:19px}.work-action strong{display:block;font-size:26px;line-height:1;color:var(--primary-dark)}.work-action small{display:block;color:var(--muted);margin-top:7px}.work-action.hot{border-color:rgba(201,132,25,.35)}.work-action.warn>span,.work-action.hot>span{background:var(--accent-soft)}.work-action.danger{border-color:rgba(209,73,73,.27)}.work-action.danger>span{background:#fdecea}.work-action.danger strong{color:var(--danger)} .modern-kpi{display:flex;gap:14px;align-items:center}.modern-kpi .kpi-icon{width:46px;height:46px;border-radius:14px;background:var(--primary-light);display:grid;place-items:center;font-size:21px;flex:0 0 auto}.modern-kpi .k-num{font-size:25px!important}.executive-grid{grid-template-columns:repeat(4,minmax(180px,1fr))}.compact-kpis{grid-template-columns:repeat(4,minmax(150px,1fr));max-width:850px}.dashboard-panels{align-items:start}.metric-row{display:grid;grid-template-columns:minmax(90px,140px) 1fr 42px;gap:10px;align-items:center;margin:12px 0;font-size:13px}.metric-row>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}.metric-track{height:10px;background:var(--primary-light);border-radius:999px;overflow:hidden}.metric-track i{display:block;height:100%;border-radius:999px;min-width:4px}.metric-row>b{text-align:left;color:var(--primary-dark)}.activity-list>div{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}.activity-list>div:last-child{border-bottom:0}.activity-list p{margin:0;min-width:0}.activity-list strong,.activity-list small{display:block}.activity-list strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activity-list small{color:var(--muted);margin-top:3px}.activity-dot{width:9px;height:9px;border-radius:50%;background:var(--primary);margin-top:6px;box-shadow:0 0 0 5px var(--primary-light);flex:0 0 auto}.activity-dot.gold{background:var(--accent);box-shadow:0 0 0 5px var(--accent-soft)} .priority-tag,.workflow-status{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800}.priority-tag.normal{background:var(--primary-light);color:var(--primary)}.priority-tag.high,.priority-tag.urgent{background:#fdecea;color:var(--danger)}.priority-tag.low{background:#edf3f7;color:#52657a}.workflow-status.new{background:var(--accent-soft);color:var(--accent-dark)}.workflow-status.in_review{background:#e8f0fe;color:#1a5fb4}.workflow-status.approved{background:#e4f8f0;color:#087658}.workflow-status.completed{background:var(--primary-light);color:var(--primary)}.workflow-status.rejected,.workflow-status.cancelled{background:#fdecea;color:var(--danger)} .quality-hero{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:24px;padding:24px;border-radius:22px;background:linear-gradient(135deg,var(--surface),var(--primary-light));border:1px solid rgba(8,127,114,.14);box-shadow:var(--shadow)}.quality-score{width:116px;height:116px;border-radius:50%;display:grid;place-items:center;align-content:center;background:conic-gradient(var(--primary) var(--quality,88%),var(--border) 0);border:10px solid var(--surface);box-shadow:0 8px 25px rgba(5,67,61,.12)}.quality-score strong{font-size:25px;color:var(--primary-dark)}.quality-score span{font-size:11px;color:var(--muted)}.quality-meta{text-align:center;padding-inline:24px;border-inline-start:1px solid var(--border)}.quality-meta b{display:block;font-size:30px;color:var(--danger)}.quality-meta span,.quality-meta small{display:block}.quality-meta small{color:var(--muted);margin-top:4px}.quality-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.quality-tile{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:15px;text-align:right;font-family:inherit;color:var(--text);cursor:pointer}.quality-tile:hover{border-color:var(--primary);transform:translateY(-2px)}.quality-tile span,.quality-tile small{display:block}.quality-tile strong{display:block;font-size:24px;color:var(--success);margin:6px 0}.quality-tile small{color:var(--muted)}.quality-tile.has-issues strong{color:var(--danger)} @media(max-width:1180px){.work-grid{grid-template-columns:repeat(3,1fr)}.executive-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:760px){.hero-panel{align-items:flex-start;flex-direction:column;padding:22px}.work-grid,.quality-grid{grid-template-columns:repeat(2,1fr)}.quality-hero{grid-template-columns:1fr;text-align:center}.quality-score{margin:auto}.quality-meta{border:0;border-top:1px solid var(--border);padding-top:16px}.executive-grid,.compact-kpis{grid-template-columns:repeat(2,1fr)}} @media(max-width:460px){.work-grid,.quality-grid,.executive-grid,.compact-kpis{grid-template-columns:1fr}} /* ===================================================================== v7.1 — College Intelligence & Governance ===================================================================== */ .college-cards{display:grid;grid-template-columns:repeat(3,minmax(260px,1fr));gap:16px}.college-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:18px;box-shadow:var(--shadow);transition:.2s}.college-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(5,67,61,.12)}.college-card-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding-bottom:14px;border-bottom:1px solid var(--border)}.college-card-head small{color:var(--muted)}.college-card-head h3{margin:4px 0 0;color:var(--primary-dark);font-size:17px}.college-card-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:15px 0}.college-card-stats span{background:var(--primary-light);border-radius:12px;padding:9px 5px;text-align:center;color:var(--muted);font-size:10px}.college-card-stats b{display:block;color:var(--primary-dark);font-size:18px;margin-bottom:2px}.college-health{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.college-health>div{display:flex;justify-content:space-between;gap:8px;padding:8px 10px;background:var(--bg);border-radius:10px;font-size:12px}.full-btn{width:100%;justify-content:center;margin-top:12px}.audit-action{display:inline-flex;background:var(--primary-light);color:var(--primary);border-radius:999px;padding:4px 8px;font-size:11px;font-weight:800}.audit-details{max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pager{display:flex;justify-content:center;align-items:center;gap:14px;padding:18px}.text-danger{color:var(--danger)!important} @media(max-width:1180px){.college-cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.college-cards{grid-template-columns:1fr}.college-card-stats{grid-template-columns:repeat(2,1fr)}} /* v7.2 operations + printable labels */ .ops-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}.ops-card{border:1px solid var(--border);background:var(--card,#fff);border-radius:16px;padding:18px;text-align:right;display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;cursor:pointer;color:inherit}.ops-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.ops-card.warn{border-inline-start:4px solid var(--warning)}.ops-card.danger{border-inline-start:4px solid var(--danger)}.ops-count{width:46px;height:46px;border-radius:14px;background:var(--primary-light);display:grid;place-items:center;font-size:20px;font-weight:800}.ops-card p{margin:4px 0 0;color:var(--muted);font-size:12px}.label-sheet{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:10px}.print-label{background:#fff;color:#111;border:1px dashed #888;border-radius:8px;padding:10px;display:flex;gap:10px;align-items:center;break-inside:avoid}.print-label img{width:76px;height:76px}.print-label div{display:flex;flex-direction:column;min-width:0}.print-label strong{font-size:16px}.print-label span{font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}.print-label small{font-size:10px;color:#555}@media print{.sidebar,.topbar,.toolbar,.section-head,#toast{display:none!important}.content{padding:0!important}.main{display:block!important}.label-sheet{grid-template-columns:repeat(3,1fr)!important;gap:4mm}.print-label{border:1px solid #000;page-break-inside:avoid}.print-label img{width:22mm;height:22mm}} /* v7.3 */ .notification-item{padding:12px;border-bottom:1px solid var(--border);border-radius:10px}.notification-item:not(.is-read){background:rgba(200,149,47,.08);border-inline-start:4px solid var(--accent)}.notification-item.is-read{opacity:.72}.annual-report-card{border:1px solid rgba(200,149,47,.35);background:linear-gradient(135deg,rgba(200,149,47,.08),transparent 45%)}.annual-row{padding:8px 0;border-bottom:1px dashed var(--border)} /* ===================================================================== v7.5 — Institutional Visual System ===================================================================== */ :root{ --radius:16px; --shadow:0 8px 28px rgba(10,68,68,.07); --shadow-lg:0 20px 55px rgba(10,68,68,.14); --v75-glass:rgba(255,255,255,.82); } body{background: radial-gradient(circle at 10% 0%,rgba(200,149,47,.06),transparent 28rem), radial-gradient(circle at 95% 12%,rgba(15,92,92,.07),transparent 30rem), var(--bg);} .card,.table-card,.kpi{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease} .card:hover{border-color:rgba(15,92,92,.18)} .kpi.modern-kpi:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)} .btn{border-radius:12px;font-weight:700;min-height:38px} .btn.accent{box-shadow:0 8px 20px rgba(200,149,47,.18)} .input,select,textarea{min-height:42px;border-radius:12px} table thead th{background:linear-gradient(180deg,rgba(15,92,92,.055),rgba(15,92,92,.02));font-weight:800} tbody tr{transition:background .15s ease} tbody tr:hover{background:rgba(15,92,92,.035)} .badge{font-weight:700} .spinner{border-width:3px} /* Dashboard shell */ .sidebar{background: radial-gradient(circle at 50% -10%,rgba(200,149,47,.18),transparent 20rem), linear-gradient(180deg,#092f38 0%,#0a4444 55%,#082e34 100%) !important; box-shadow:-8px 0 30px rgba(0,0,0,.08)} .sidebar .brand{min-height:86px} .sidebar .brand .logo{box-shadow:0 0 0 5px rgba(255,255,255,.07),0 8px 25px rgba(0,0,0,.18)} .nav a{margin:2px 9px;border-radius:11px;border-right:0!important;padding:11px 13px!important} .nav a.active{background:linear-gradient(90deg,rgba(200,149,47,.24),rgba(255,255,255,.08))!important;box-shadow:inset -3px 0 0 var(--accent)} .nav a:hover{transform:translateX(-2px)} .topbar{background:var(--v75-glass)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 5px 25px rgba(10,68,68,.05)} .content{max-width:1680px;width:100%;margin-inline:auto} .modern-kpi{position:relative;overflow:hidden} .modern-kpi:after{content:'';position:absolute;width:90px;height:90px;border-radius:50%;background:rgba(15,92,92,.045);inset:auto -28px -35px auto} .kpi-icon{filter:drop-shadow(0 6px 8px rgba(0,0,0,.08))} .work-action{border-radius:15px!important} /* OPAC */ .opac-header{position:relative;overflow:hidden;background: radial-gradient(circle at 18% 30%,rgba(200,149,47,.22),transparent 24rem), radial-gradient(circle at 82% 15%,rgba(255,255,255,.10),transparent 22rem), linear-gradient(135deg,#0b5259,#092f43 70%,#071f33)!important} .opac-header:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.22; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:42px 42px;mask-image:linear-gradient(to bottom,#000,transparent)} .opac-nav,.hero{position:relative;z-index:2} .hero{padding-top:42px!important} .hero h1{font-size:clamp(34px,5vw,58px)!important;letter-spacing:-1.5px;line-height:1.18} .hero p{max-width:720px;margin-inline:auto;font-size:17px!important} .search-box{max-width:900px!important;border-radius:20px!important;padding:10px!important;border:1px solid rgba(255,255,255,.7);box-shadow:0 25px 65px rgba(0,0,0,.20)!important} .search-box input{font-size:17px!important} .stats-row{max-width:1000px!important} .stat{border-top:3px solid var(--accent);box-shadow:0 14px 35px rgba(10,68,68,.10)!important} .stat .num{font-size:30px!important} .result-card{border-radius:18px!important;overflow:hidden;position:relative} .result-card:before{content:'';position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(var(--accent),var(--primary));opacity:0;transition:.2s} .result-card:hover:before{opacity:1} .result-card:hover{transform:translateY(-5px)!important} .result-cover{border-radius:10px!important;box-shadow:0 7px 18px rgba(0,0,0,.10)} .filters{background:var(--surface);padding:12px;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow)} footer{background:#082f38!important;color:#dbe8e8!important;padding:28px 20px!important} /* Member portal */ .member-brand-header{background: radial-gradient(circle at 15% 20%,rgba(200,149,47,.22),transparent 18rem), linear-gradient(120deg,#092f43,#0b5959)!important;box-shadow:0 8px 30px rgba(0,0,0,.12)} .member-brand-inner{min-height:76px} .member-brand-title img{filter:drop-shadow(0 5px 10px rgba(0,0,0,.25))} .member-card,.digital-repo-card{border-radius:18px!important} /* Mobile */ @media(max-width:860px){ .content{padding:14px!important} .topbar{padding:11px 14px!important} .sidebar{width:68px!important} .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important} .kpi{padding:14px!important} .kpi .k-num{font-size:23px!important} .opac-nav{padding:12px 14px!important} .opac-nav .brand>span:last-child{font-size:14px} .hero{padding:28px 14px 54px!important} .search-box{margin-inline:8px!important;flex-wrap:wrap} .search-wrap{min-width:100%;flex-basis:100%} .stats-row{grid-template-columns:repeat(2,1fr)!important;gap:9px!important;padding:0 12px!important} .stat{padding:13px!important} .container{padding:22px 12px!important} .results{grid-template-columns:1fr!important} .filters select{width:100%!important} } @media(max-width:520px){ .kpi-grid{grid-template-columns:1fr 1fr!important} .grid-2,.grid-3{grid-template-columns:1fr!important} .hero h1{font-size:35px!important} .hero .hero-logo{width:88px!important;height:88px!important} .opac-access-nav{gap:5px!important} .access-pill{font-size:0!important;padding:8px!important} .access-pill span:first-child{font-size:18px!important} } @media print{ .sidebar,.topbar,.btn,.toolbar,.tabs{display:none!important} .main,.content{display:block!important;width:100%!important;padding:0!important} .card,.table-card,.kpi{box-shadow:none!important;break-inside:avoid} body{background:white!important;color:#111!important} } /* ===================================================================== v7.12 — Wasit Royal Emerald Theme Visual refresh: transparent logo treatment, richer institutional theme, clearer hierarchy, softer cards and improved dashboard polish. ===================================================================== */ :root{ --primary:#0a766f; --primary-dark:#064b47; --primary-deep:#032f33; --primary-light:#e4f4f1; --primary-glow:#43c8b8; --accent:#d8a52f; --accent-dark:#a87416; --accent-soft:#fff4d5; --bg:#eef5f4; --surface:#ffffff; --surface-2:#f7fbfa; --text:#142b2b; --muted:#687d7c; --border:#d9e7e4; --shadow:0 10px 30px rgba(4,64,61,.08); --shadow-lg:0 24px 70px rgba(3,47,51,.18); } body{ background: radial-gradient(circle at 8% 5%,rgba(216,165,47,.10),transparent 25rem), radial-gradient(circle at 88% 8%,rgba(67,200,184,.10),transparent 30rem), linear-gradient(180deg,#f7fbfa 0%,var(--bg) 54%,#edf4f3 100%); } /* Logos: never place the institutional mark on a flat white disk/card */ .logo,.hero-logo,.member-brand-title img,.portal-brand-panel img,.login .logo, .box img[src*="logo-wasit"],img[src*="logo-wasit-official"]{ background:transparent!important; } .sidebar .brand .logo,.opac-nav .brand .logo,.hero .hero-logo{ border:0!important; box-shadow:none!important; padding:0!important; } .sidebar .brand .logo img,.opac-nav .brand .logo img,.hero-logo img, .member-brand-title img,.portal-brand-panel img,.login .logo, .box img[src*="logo-wasit"]{ filter:drop-shadow(0 10px 14px rgba(0,0,0,.20)); } .portal-brand-panel img{ border:0!important; border-radius:0!important; padding:0!important; box-shadow:none!important; } /* Premium institutional shell */ .sidebar{ background: radial-gradient(circle at 45% -5%,rgba(216,165,47,.24),transparent 18rem), linear-gradient(180deg,#063b43 0%,#074f4d 48%,#04343b 100%)!important; border-left:1px solid rgba(255,255,255,.06); } .sidebar .brand{border-bottom:1px solid rgba(255,255,255,.08)} .nav a{color:#dceceb!important} .nav a:hover{background:rgba(255,255,255,.08)!important;color:#fff!important} .nav a.active{ color:#fff!important; background:linear-gradient(90deg,rgba(216,165,47,.28),rgba(255,255,255,.08))!important; box-shadow:inset -3px 0 0 #f1c45a,0 8px 24px rgba(0,0,0,.08); } .topbar{ background:rgba(248,252,251,.88)!important; border-bottom:1px solid rgba(6,75,71,.08)!important; backdrop-filter:blur(18px) saturate(130%); -webkit-backdrop-filter:blur(18px) saturate(130%); } /* Cards and data surfaces */ .card,.table-card,.kpi,.college-card,.ops-card{ background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,253,252,.98)); border-color:rgba(6,75,71,.09); box-shadow:0 9px 28px rgba(4,64,61,.065); } .card:hover,.college-card:hover,.ops-card:hover{ border-color:rgba(10,118,111,.18); box-shadow:0 18px 46px rgba(4,64,61,.11); } .modern-kpi{border-top:1px solid rgba(216,165,47,.26)} .modern-kpi .kpi-icon{ background:linear-gradient(135deg,var(--primary-light),#f4fbf9); box-shadow:inset 0 0 0 1px rgba(10,118,111,.08); } /* Buttons */ .btn{ background:linear-gradient(135deg,#08786f,#0a9486); box-shadow:0 8px 20px rgba(8,120,111,.20); } .btn:hover{background:linear-gradient(135deg,#06655f,#087d74)} .btn.accent{ background:linear-gradient(135deg,#d39b24,#efc45e); color:#302307; box-shadow:0 8px 20px rgba(211,155,36,.20); } .btn.ghost{background:rgba(255,255,255,.60);box-shadow:none} /* Public catalogue hero */ .opac-header{ background: radial-gradient(circle at 14% 20%,rgba(239,196,94,.24),transparent 25rem), radial-gradient(circle at 86% 12%,rgba(83,210,192,.16),transparent 25rem), linear-gradient(135deg,#064c50 0%,#063b4c 52%,#071f38 100%)!important; } .hero-logo{ position:relative; background:radial-gradient(circle,rgba(255,255,255,.14),transparent 66%)!important; border-radius:50%; } .search-box{ background:rgba(255,255,255,.96)!important; border:1px solid rgba(255,255,255,.76)!important; box-shadow:0 25px 70px rgba(0,0,0,.22)!important; } .stat{background:rgba(255,255,255,.97)!important;border-top-color:#e6b34c!important} /* Member and authentication experiences */ .member-brand-header{ background: radial-gradient(circle at 12% 10%,rgba(239,196,94,.24),transparent 20rem), linear-gradient(120deg,#063f4d,#08746c)!important; } .portal-brand-panel{ background: linear-gradient(rgba(4,47,51,.76),rgba(5,76,71,.82)), url('/img/wasit-campus.jpg') center/cover!important; } .login,.box{ border:1px solid rgba(6,75,71,.10)!important; box-shadow:0 28px 70px rgba(3,47,51,.18)!important; } /* Form polish */ .input,select,textarea{ background:rgba(255,255,255,.92); border-color:#d7e5e2; } .input:focus,select:focus,textarea:focus{ border-color:#1aa294; box-shadow:0 0 0 4px rgba(26,162,148,.12); } th{background:linear-gradient(180deg,#eef8f6,#e8f3f1)!important} /* Dark mode compatibility */ [data-theme="dark"] body{background:linear-gradient(180deg,#071612,#091c19)} [data-theme="dark"] .topbar{background:rgba(9,28,25,.88)!important} [data-theme="dark"] .card,[data-theme="dark"] .table-card,[data-theme="dark"] .kpi, [data-theme="dark"] .college-card,[data-theme="dark"] .ops-card{ background:linear-gradient(180deg,#10241f,#0d201c); border-color:#23453e; } @media(max-width:720px){ .sidebar .brand .logo img{filter:drop-shadow(0 6px 8px rgba(0,0,0,.2))} .hero-logo{background:transparent!important} } /* ===================================================================== v7.13 — Executive Command Dashboard ===================================================================== */ .topbar-title-wrap{display:flex;align-items:center;gap:10px;min-width:max-content} .menu-toggle,.sidebar-close{display:none;border:0;background:transparent;font:inherit;cursor:pointer;color:inherit} .topbar-command{position:relative;width:min(390px,34vw);height:42px;display:flex;align-items:center;gap:8px;padding:0 10px 0 7px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.7);transition:.2s} .topbar-command:focus-within{border-color:rgba(10,118,111,.45);box-shadow:0 0 0 4px rgba(10,118,111,.08);background:var(--surface)} .topbar-command>span{font-size:21px;color:var(--primary)} .topbar-command input{width:100%;border:0;outline:0;background:transparent;color:var(--text);font-family:inherit;font-size:13px} .topbar-command kbd{font:700 10px/1.2 inherit;color:var(--muted);border:1px solid var(--border);border-bottom-width:2px;border-radius:6px;padding:3px 5px;background:var(--surface-2);white-space:nowrap} .command-results{display:none;position:absolute;top:49px;inset-inline:0;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-lg);border-radius:14px;padding:7px;z-index:100;max-height:320px;overflow:auto} .command-results.show{display:block} .command-item{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:0;background:transparent;color:var(--text);padding:10px 11px;border-radius:10px;font-family:inherit;cursor:pointer;text-align:start} .command-item:hover,.command-item.active{background:var(--primary-light);color:var(--primary-dark)} .command-item small{color:var(--muted)} .sidebar-close{margin-inline-start:auto;font-size:28px;color:#fff} .sidebar-backdrop{display:none} .dashboard-welcome{display:grid;grid-template-columns:1.5fr auto;gap:20px;align-items:center;position:relative} .dashboard-welcome .welcome-copy{position:relative;z-index:2} .dashboard-welcome .welcome-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px} .welcome-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);font-size:12px;color:#eef9f6} .dashboard-seal{width:118px;height:118px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.12),rgba(255,255,255,.025) 68%);border:1px solid rgba(255,255,255,.14);position:relative;z-index:2} .dashboard-seal img{width:94px;height:94px;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(0,0,0,.28))} .quick-launch-grid{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:11px} .quick-launch{border:1px solid var(--border);background:linear-gradient(180deg,var(--surface),var(--surface-2));border-radius:16px;padding:15px 12px;display:flex;align-items:center;gap:11px;cursor:pointer;color:var(--text);font-family:inherit;text-align:start;box-shadow:0 6px 20px rgba(4,64,61,.045);transition:.18s} .quick-launch:hover{transform:translateY(-2px);border-color:rgba(10,118,111,.22);box-shadow:0 13px 28px rgba(4,64,61,.10)} .quick-launch .q-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:var(--primary-light);font-size:18px;flex:0 0 auto} .quick-launch strong{display:block;font-size:13px}.quick-launch small{display:block;color:var(--muted);font-size:10px;margin-top:2px} .dashboard-status-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0 0} .status-box{padding:11px 13px;border-radius:14px;border:1px solid rgba(6,75,71,.08);background:rgba(255,255,255,.58);display:flex;align-items:center;gap:9px;font-size:12px} .status-box b{display:block;color:var(--primary-dark);font-size:13px}.status-box small{display:block;color:var(--muted);margin-top:1px}.status-dot{width:9px;height:9px;border-radius:50%;background:#21a67a;box-shadow:0 0 0 4px rgba(33,166,122,.12)} .status-dot.gold{background:var(--accent);box-shadow:0 0 0 4px rgba(216,165,47,.13)} .dashboard-panels>.card{min-height:250px} .sidebar .foot{color:#b8d8d4!important;text-align:center;border-top-color:rgba(255,255,255,.08)!important} [data-theme="dark"] .topbar-command{background:rgba(15,36,31,.8)} [data-theme="dark"] .command-results{background:#10241f} [data-theme="dark"] .quick-launch{background:linear-gradient(180deg,#10241f,#0d201c)} [data-theme="dark"] .status-box{background:rgba(16,36,31,.72)} @media(max-width:1180px){.quick-launch-grid{grid-template-columns:repeat(3,1fr)}.topbar-command{width:min(320px,30vw)}} @media(max-width:900px){ .topbar-command{display:none}.menu-toggle{display:block;font-size:23px;color:var(--primary-dark)} .sidebar{position:fixed!important;inset-block:0;inset-inline-start:0;transform:translateX(110%);width:270px!important;z-index:120;transition:transform .25s ease} html[dir="ltr"] .sidebar{transform:translateX(-110%)} .sidebar.mobile-open{transform:translateX(0)!important} .sidebar.mobile-open .brand span,.sidebar.mobile-open .nav a span:not(.icon),.sidebar.mobile-open .foot{display:block!important} .sidebar-close{display:block}.sidebar-backdrop.show{display:block;position:fixed;inset:0;background:rgba(2,24,23,.48);backdrop-filter:blur(2px);z-index:110} .dashboard-status-strip{grid-template-columns:repeat(2,1fr)} } @media(max-width:700px){.dashboard-welcome{grid-template-columns:1fr}.dashboard-seal{display:none}.quick-launch-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:480px){.quick-launch-grid,.dashboard-status-strip{grid-template-columns:1fr}.user-chip #userName,.user-chip #userRole{display:none}.topbar{gap:8px!important}.topbar h2{font-size:16px!important}} /* ===================================================================== v7.15 — Member Experience Dashboard ===================================================================== */ .member-portal-page{background:linear-gradient(180deg,#edf7f4 0,#f7faf9 420px,var(--bg) 760px);min-height:100vh}.member-wrap{max-width:1240px;margin:0 auto;padding:28px 24px 54px}.member-brand-header{position:sticky;top:0;z-index:70;background:linear-gradient(112deg,#06483f,#087f72 62%,#0b665d);box-shadow:0 7px 25px rgba(4,58,52,.18);color:#fff}.member-brand-inner{max-width:1280px;margin:auto;padding:10px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}.member-brand-title{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}.member-brand-title img{width:52px;height:52px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.18))}.member-brand-title strong,.member-brand-title small{display:block}.member-brand-title strong{font-size:18px}.member-brand-title small{opacity:.8;margin-top:2px}.member-header-actions{display:flex;gap:8px;align-items:center}.member-header-actions .ghost{color:#fff;border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.06)} .member-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;padding:28px;border-radius:26px;background:linear-gradient(125deg,#06483f,#087f72 62%,#09665c);color:#fff;box-shadow:0 20px 55px rgba(5,67,61,.2);margin-bottom:16px}.member-hero:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;border:1px solid rgba(232,190,77,.25);right:-92px;top:-135px;box-shadow:0 0 0 34px rgba(255,255,255,.025),0 0 0 70px rgba(255,255,255,.02)}.member-avatar{width:78px;height:78px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(145deg,#f2cf73,#dcae42);color:#19463f;font-size:28px;font-weight:900;box-shadow:0 12px 30px rgba(0,0,0,.14);z-index:1}.member-hero-copy{z-index:1}.member-eyebrow{font-size:12px;font-weight:800;color:#f2d17d}.member-hero h1{margin:4px 0 6px;font-size:28px}.member-hero p{margin:0;color:rgba(255,255,255,.78)}.member-hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.member-hero-tags span{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);font-size:12px}.member-hero-tags span.warn{background:rgba(237,186,57,.17);border-color:rgba(237,186,57,.35)}.member-hero-actions{display:flex;flex-direction:column;gap:8px;z-index:1;min-width:150px}.member-hero-actions .ghost{color:#fff;border-color:rgba(255,255,255,.36);background:rgba(255,255,255,.06)} .member-attention{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;border:1px solid var(--border);background:var(--surface);border-radius:17px;padding:13px 16px;margin-bottom:16px;box-shadow:var(--shadow)}.member-attention .attention-icon{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;font-size:18px}.member-attention strong,.member-attention p{display:block;margin:0}.member-attention p{font-size:12px;color:var(--muted);margin-top:2px}.member-attention.ok .attention-icon{background:#e5f7ef;color:#087658}.member-attention.warning .attention-icon{background:#fff3d6;color:#a66c0d}.member-attention.danger{border-color:rgba(209,73,73,.27)}.member-attention.danger .attention-icon{background:#fdecea;color:var(--danger)} .member-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.member-kpis button{display:flex;align-items:center;gap:12px;text-align:right;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:18px;padding:16px;box-shadow:var(--shadow);font-family:inherit;cursor:pointer;transition:.2s}.member-kpis button:hover{transform:translateY(-2px);border-color:rgba(8,127,114,.35)}.member-kpi-icon{width:43px;height:43px;border-radius:14px;display:grid;place-items:center;background:var(--primary-light);font-size:19px}.member-kpis strong,.member-kpis small{display:block}.member-kpis strong{font-size:24px;color:var(--primary-dark);line-height:1}.member-kpis small{color:var(--muted);font-size:11px;margin-top:5px}.member-quick-nav{display:flex;gap:8px;overflow:auto;padding:4px 0 16px;scrollbar-width:thin}.member-quick-nav button{white-space:nowrap;border:1px solid var(--border);border-radius:999px;padding:9px 13px;background:var(--surface);color:var(--text);font-family:inherit;font-weight:750;cursor:pointer}.member-quick-nav button:hover{border-color:var(--primary);color:var(--primary)} .member-section-anchor{scroll-margin-top:86px}.member-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:22px 0 12px}.member-section-head.compact{margin:0 0 15px;align-items:flex-start}.member-section-head>div>span{font-size:11px;font-weight:900;color:var(--primary);text-transform:uppercase;letter-spacing:.04em}.member-section-head h2{font-size:20px;margin:3px 0;color:var(--primary-dark)}.member-section-head p{margin:0;color:var(--muted);font-size:12px}.member-loan-list,.member-reservation-list{display:grid;gap:10px}.member-loan-card,.member-reservation-card{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:16px 18px;border-radius:18px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow)}.member-loan-card.danger{border-inline-start:5px solid var(--danger)}.member-loan-card.warning{border-inline-start:5px solid #d8951c}.member-loan-card.success{border-inline-start:5px solid var(--success)}.member-loan-icon{width:45px;height:45px;border-radius:14px;display:grid;place-items:center;background:var(--primary-light);font-size:20px}.member-loan-main{min-width:0}.member-loan-main strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.member-loan-main p{margin:5px 0}.member-loan-meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:11px}.member-due-pill{display:inline-flex;flex:0 0 auto;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:900}.member-due-pill.success{background:#e4f8ef;color:#087658}.member-due-pill.warning{background:#fff3d6;color:#9b6712}.member-due-pill.danger{background:#fdecea;color:var(--danger)}.member-renew-done{font-size:11px}.member-reservation-card .member-status{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:900}.member-status.pending{background:#fff3d6;color:#95630f}.member-status.ready{background:#e4f8ef;color:#087658}.member-status.fulfilled{background:var(--primary-light);color:var(--primary)}.member-status.cancelled,.member-status.expired{background:#edf1f4;color:#65727d}.member-empty-state{text-align:center;border:1px dashed var(--border);border-radius:18px;padding:26px;background:rgba(255,255,255,.4);color:var(--muted)}.member-empty-state>span{display:block;font-size:27px;margin-bottom:5px}.member-empty-state strong{display:block;color:var(--text);margin-bottom:3px}.member-empty-state p{margin:0;font-size:12px} .member-feature-card{margin-top:18px;padding:20px;border-radius:20px}.member-search-row{display:grid;grid-template-columns:minmax(240px,1fr) minmax(180px,250px) auto;gap:9px}.member-search-row-4{grid-template-columns:minmax(220px,1fr) 170px 190px auto}.member-search-row.compact-search{grid-template-columns:1fr auto}.member-result-card{box-shadow:none!important;border-radius:15px!important}.member-info-strip{background:var(--accent-soft)!important}.member-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}.member-facility-form{display:grid;grid-template-columns:1.1fr 1.4fr 1fr 1fr auto;gap:9px}.member-facility-list{margin-top:12px}.member-facility-list>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--border)}.member-facility-list strong,.member-facility-list small{display:block}.member-facility-list small{color:var(--muted);margin-top:2px}.member-notifications .notification-item{display:grid;grid-template-columns:auto 1fr;gap:11px;margin:0;padding:13px 3px;border-bottom:1px solid var(--border);border-radius:0}.member-notifications .notification-item:not(.is-read){background:transparent;border-inline-start:0}.notification-dot{width:9px;height:9px;margin-top:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px var(--accent-soft)}.notification-item.is-read .notification-dot{background:#aeb9bc;box-shadow:none}.member-notifications p{margin:4px 0;color:var(--muted);font-size:12px}.member-notifications small{color:var(--muted)}.member-privacy-note{text-align:center;color:var(--muted);font-size:11px;margin:22px 0}.member-footer{max-width:1240px;margin:0 auto;padding:18px 24px 28px;border-top:1px solid var(--border);display:flex;justify-content:space-between;color:var(--muted);font-size:11px} .member-modal{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px}.member-modal-backdrop{position:absolute;inset:0;background:rgba(5,35,32,.62);backdrop-filter:blur(6px)}.member-modal-panel{position:relative;width:min(94vw,490px);background:var(--surface);padding:22px;border-radius:25px;box-shadow:0 30px 90px rgba(0,0,0,.25)}.member-modal-close{position:absolute;top:10px;left:12px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(0,0,0,.06);font-size:22px;cursor:pointer;z-index:2}.member-modal-actions{display:flex;justify-content:center;gap:8px;margin-top:14px}.digital-member-card{overflow:hidden;border-radius:24px;background:linear-gradient(140deg,#06483f,#087f72 65%,#0b655b);color:#fff;box-shadow:0 18px 50px rgba(5,67,61,.25);border:1px solid rgba(233,194,88,.35)}.digital-card-top{display:flex;align-items:center;gap:11px;padding:15px 18px;border-bottom:1px solid rgba(255,255,255,.13)}.digital-card-top img{width:55px;height:55px;object-fit:contain}.digital-card-top strong,.digital-card-top small{display:block}.digital-card-top small{opacity:.72}.digital-card-body{text-align:center;padding:18px 24px 22px}.digital-card-name small{color:#f1cd72;font-weight:800}.digital-card-name h2{margin:5px 0 2px;font-size:22px}.digital-card-name p{margin:0;opacity:.72}.digital-card-qr{display:block;width:190px;height:190px;background:#fff;padding:8px;border-radius:18px;margin:14px auto}.digital-card-number small,.digital-card-number strong{display:block}.digital-card-number small{opacity:.65}.digital-card-number strong{font-size:21px;letter-spacing:1px;color:#f1d17f}.digital-card-meta{display:flex;justify-content:space-between;gap:12px;margin-top:15px;padding-top:12px;border-top:1px solid rgba(255,255,255,.14);font-size:10px;opacity:.8} @media(max-width:1050px){.member-facility-form{grid-template-columns:1fr 1fr}.member-facility-form .btn{grid-column:span 2}.member-search-row-4{grid-template-columns:1fr 1fr}.member-search-row-4 .btn{grid-column:span 2}.member-kpis{grid-template-columns:repeat(2,1fr)}} @media(max-width:780px){.member-wrap{padding:18px 12px 38px}.member-brand-inner{padding:9px 12px}.member-brand-title img{width:44px;height:44px}.member-brand-title strong{font-size:15px}.member-brand-title small{font-size:10px}.member-header-actions .ghost{display:none}.member-hero{grid-template-columns:auto 1fr;padding:20px;gap:13px}.member-avatar{width:58px;height:58px;border-radius:18px;font-size:21px}.member-hero h1{font-size:21px}.member-hero-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.member-attention{grid-template-columns:auto 1fr}.member-attention>.btn{grid-column:1/-1}.member-grid-2{grid-template-columns:1fr}.member-search-row,.member-search-row-4{grid-template-columns:1fr}.member-search-row .btn,.member-search-row-4 .btn{grid-column:auto}.member-loan-card,.member-reservation-card{grid-template-columns:auto 1fr}.member-loan-card>div:last-child,.member-reservation-card>button{grid-column:2}.member-section-head{align-items:flex-start}.member-footer{flex-direction:column;gap:5px;padding-inline:12px}.table-wrap{overflow-x:auto}} @media(max-width:480px){.member-kpis{grid-template-columns:1fr 1fr;gap:8px}.member-kpis button{padding:12px 9px;gap:8px}.member-kpi-icon{width:37px;height:37px}.member-kpis strong{font-size:20px}.member-hero-tags{display:none}.member-hero-actions{grid-template-columns:1fr}.member-section-head{display:block}.member-section-head>.scope-chip{margin-top:8px}.member-loan-card,.member-reservation-card{padding:13px 12px}.member-loan-main .flex.between{display:block}.member-due-pill{margin-top:6px}.member-facility-form{grid-template-columns:1fr}.member-facility-form .btn{grid-column:auto}.digital-card-meta{display:block}.digital-card-meta span{display:block;margin-top:4px}} html[data-theme="dark"] .member-portal-page,body.dark .member-portal-page{background:linear-gradient(180deg,#092c29,#0e2423 500px,var(--bg) 760px)} /* ============================================================ v7.16 — College Operations Workspace ============================================================ */ body.college-scope .sidebar{ background: radial-gradient(circle at 15% 5%,rgba(232,194,88,.13),transparent 24%), linear-gradient(180deg,#043e39 0%,#07594f 48%,#043b36 100%); } body.college-scope .sidebar .brand{border-bottom-color:rgba(232,194,88,.22)} body.college-scope .sidebar .brand .logo{ background:rgba(255,255,255,.05)!important; border:1px solid rgba(232,194,88,.32); box-shadow:0 8px 24px rgba(0,0,0,.16); } body.college-scope .sidebar .nav a.active{ background:linear-gradient(90deg,rgba(232,194,88,.19),rgba(255,255,255,.07)); border-color:rgba(232,194,88,.34); color:#fff; } .college-dashboard-hero{ position:relative; overflow:hidden; background: radial-gradient(circle at 82% 22%,rgba(240,204,104,.18),transparent 22%), linear-gradient(135deg,#064d45 0%,#08776b 58%,#07534c 100%)!important; border:1px solid rgba(232,194,88,.28)!important; } .college-dashboard-hero:after{ content:var(--college-monogram,'ك'); position:absolute; inset-inline-start:5%; bottom:-38px; font-size:150px; line-height:1; font-weight:950; color:rgba(255,255,255,.035); pointer-events:none; } .college-dashboard-hero .welcome-copy{position:relative;z-index:2} .college-dashboard-hero .eyebrow{color:#f4d77e!important} .college-lock-chip{ background:rgba(240,204,104,.14)!important; border-color:rgba(240,204,104,.32)!important; color:#fff6d7!important; } .college-seal{position:relative} .college-seal img{ filter:drop-shadow(0 12px 22px rgba(0,0,0,.18)); } .college-seal-badge{ position:absolute; inset-inline-end:-8px; bottom:-7px; min-width:42px;height:42px;padding:0 9px; border-radius:14px; display:grid;place-items:center; background:linear-gradient(145deg,#f0cf73,#d8a83e); border:3px solid #075d54; color:#173c37; font-size:15px;font-weight:950; box-shadow:0 10px 24px rgba(0,0,0,.18); } body.college-scope .scope-chip{ border-color:rgba(9,127,114,.28); background:linear-gradient(180deg,#eefaf7,#e3f5f0); color:#06695f; } html[data-theme="dark"] body.college-scope .scope-chip{ background:rgba(16,121,108,.15); border-color:rgba(78,196,177,.22); color:#87ddd0; } @media(max-width:780px){ .college-dashboard-hero:after{font-size:100px;bottom:-20px} .college-seal-badge{min-width:36px;height:36px;border-radius:12px;font-size:13px} } /* v7.17 — Presidency college command center */ .college-command-hero{background:linear-gradient(135deg,#073d35,#0b5a4d 62%,#8c6b20);color:#fff;border-radius:22px;padding:24px 26px;display:flex;justify-content:space-between;gap:20px;align-items:center;box-shadow:0 18px 45px rgba(7,61,53,.18);position:relative;overflow:hidden}.college-command-hero:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.06);inset-inline-end:-90px;top:-130px}.college-command-hero h2{font-size:25px;margin:5px 0}.college-command-hero p{color:#d9eee9;margin:0;max-width:720px}.college-command-kicker{font-size:12px;color:#f2d88b;font-weight:800}.college-command-actions{display:flex;gap:8px;flex-wrap:wrap;z-index:1}.college-command-hero .btn.ghost{border-color:rgba(255,255,255,.35);color:#fff;background:rgba(255,255,255,.08)} .college-account-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}.college-account-card{background:var(--card,#fff);border:1px solid var(--border);border-radius:20px;padding:18px;box-shadow:var(--shadow);transition:.2s transform,.2s box-shadow}.college-account-card:hover{transform:translateY(-2px);box-shadow:0 15px 35px rgba(8,63,55,.12)}.college-account-head{display:flex;align-items:center;gap:12px}.college-mark{width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#0b5a4d,#c8952f);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:900;letter-spacing:.5px;flex:0 0 auto}.college-account-name{min-width:0;flex:1}.college-account-name h3{font-size:16px;margin:0 0 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.college-status{font-size:11px;padding:5px 9px;border-radius:999px;font-weight:800}.college-status.on{background:#e9f8f1;color:#0b7a52}.college-status.off{background:#fff0f0;color:#b4232d}.college-stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:17px 0}.college-stat-row>div{background:color-mix(in srgb,var(--primary-light,#edf7f4) 72%,transparent);border-radius:12px;text-align:center;padding:9px 4px}.college-stat-row b{display:block;font-size:18px;color:var(--primary)}.college-stat-row span{font-size:10px;color:var(--muted)}.college-load-label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:6px}.college-load-track{height:7px;background:#e8eeec;border-radius:99px;overflow:hidden}.college-load-track i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#0b5a4d,#c8952f)}.college-alert-strip{display:flex;justify-content:space-between;gap:6px;background:#f7f9f8;border:1px solid var(--border);border-radius:11px;padding:8px 10px;margin:14px 0;font-size:11px;color:var(--muted)}.college-alert-strip.has-alert{background:#fff7ed;border-color:#fed7aa}.college-account-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--border);padding-top:12px;font-size:11px}.college-toolbar-wrap .input{min-width:210px}.college-toolbar-wrap select{min-width:250px} html[data-theme="dark"] .college-account-card{background:#13231f}.dark .college-account-card{background:#13231f}.dark .college-alert-strip,html[data-theme="dark"] .college-alert-strip{background:#172a25}.dark .college-status.on,html[data-theme="dark"] .college-status.on{background:#12382c;color:#73e0b3} @media(max-width:820px){.college-command-hero{align-items:flex-start;flex-direction:column}.college-command-actions{width:100%}.college-command-actions .btn{flex:1}.college-account-grid{grid-template-columns:1fr}.college-toolbar-wrap{align-items:stretch!important;flex-direction:column}.college-toolbar-wrap>div:last-child{width:100%;flex-direction:column}.college-toolbar-wrap .input,.college-toolbar-wrap select{width:100%;min-width:0}.college-account-foot{align-items:flex-start;flex-direction:column}.college-stat-row{grid-template-columns:repeat(2,1fr)}} /* v7.18 — Unified Presidency Approvals Center */ .approval-hero{background:linear-gradient(135deg,#063e36 0%,#0b6254 58%,#987528 100%);color:#fff;border-radius:24px;padding:26px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;box-shadow:0 18px 48px rgba(6,62,54,.2);position:relative;overflow:hidden}.approval-hero:before{content:"✓";position:absolute;inset-inline-end:40px;top:-42px;font-size:190px;font-weight:900;color:rgba(255,255,255,.055);transform:rotate(-8deg)}.approval-hero h1{margin:6px 0 7px;font-size:27px}.approval-hero p{margin:0;color:#dcefeb;max-width:760px}.approval-hero .hero-actions{display:flex;gap:9px;flex-wrap:wrap;z-index:1}.btn.gold{background:linear-gradient(180deg,#f2d47d,#cf9f36);color:#173c37;border:0;font-weight:900}.btn.light{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.3)} .approval-kpis{margin-top:16px}.approval-kpis .kpi.danger{border-top:3px solid #dc3545}.approval-kpis .kpi.warn{border-top:3px solid #d99a18}.approval-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:16px 0;padding:12px 14px}.approval-tabs{display:flex;gap:7px;flex-wrap:wrap}.approval-tab{border:1px solid var(--border);background:var(--card,#fff);color:var(--text);padding:8px 11px;border-radius:12px;cursor:pointer;font:inherit;font-size:12px;font-weight:800}.approval-tab b{display:inline-grid;place-items:center;min-width:21px;height:21px;margin-inline-start:4px;border-radius:999px;background:var(--primary-light,#eaf5f2);color:var(--primary)}.approval-tab.active{background:var(--primary);border-color:var(--primary);color:#fff}.approval-tab.active b{background:rgba(255,255,255,.18);color:#fff}.approval-filter{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.approval-filter select{min-width:190px} .approval-list{display:grid;gap:11px}.approval-card{display:grid;grid-template-columns:32px 48px minmax(0,1fr) auto;align-items:center;gap:13px;background:var(--card,#fff);border:1px solid var(--border);border-inline-start:4px solid #7fa89d;border-radius:18px;padding:15px 17px;box-shadow:var(--shadow);transition:.18s ease}.approval-card:hover{transform:translateY(-1px);box-shadow:0 12px 30px rgba(7,61,53,.1)}.approval-card.urgent{border-inline-start-color:#cc3242;background:linear-gradient(90deg,rgba(204,50,66,.035),var(--card,#fff) 16%)}.approval-card.high{border-inline-start-color:#d89b20}.approval-card.waiting{border-inline-start-color:#c47c18}.approval-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#edf8f5,#f8f0d8);font-size:22px}.approval-main{min-width:0}.approval-main h3{font-size:15px;margin:6px 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.approval-main p{margin:0;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.approval-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:10.5px}.approval-type{background:var(--primary-light,#eaf5f2);color:var(--primary);padding:4px 8px;border-radius:999px;font-weight:900}.wait-chip{padding:4px 7px;border-radius:999px;background:#f4f5f4}.wait-chip.late{background:#fff0db;color:#9b5c05;font-weight:900}.approval-actions{display:flex;gap:6px}.approval-check{display:grid;place-items:center}.approval-check input{width:18px;height:18px;accent-color:var(--primary)}.approval-empty{padding:38px;text-align:center}.credential-box{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:var(--primary-light,#edf7f4);border-radius:15px;padding:16px}.credential-box span{color:var(--muted);font-size:12px}.credential-box strong{font-size:18px;color:var(--primary);direction:ltr;text-align:left}.bulk-credential{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid var(--border);direction:ltr}.bulk-credential code{font-size:14px;font-weight:900} html[data-theme="dark"] .approval-card,html[data-theme="dark"] .approval-tab{background:#13231f}.dark .approval-card,.dark .approval-tab{background:#13231f}html[data-theme="dark"] .approval-icon{background:linear-gradient(145deg,#16352e,#352e19)}html[data-theme="dark"] .wait-chip{background:#1b2e29}html[data-theme="dark"] .wait-chip.late{background:#3d2c18;color:#f0bd6a} @media(max-width:900px){.approval-hero{align-items:flex-start;flex-direction:column}.approval-toolbar{align-items:stretch;flex-direction:column}.approval-filter{width:100%}.approval-filter select{flex:1}.approval-card{grid-template-columns:28px 42px minmax(0,1fr)}.approval-actions{grid-column:2/4}.approval-actions .btn{flex:1}} @media(max-width:560px){.approval-hero{padding:20px}.approval-hero h1{font-size:22px}.approval-tabs{display:grid;grid-template-columns:repeat(2,1fr)}.approval-tab{text-align:center}.approval-filter{display:grid;grid-template-columns:1fr 1fr}.approval-filter select{grid-column:1/-1;width:100%}.approval-card{padding:12px;gap:9px}.approval-icon{width:40px;height:40px}.approval-main h3,.approval-main p{white-space:normal}.approval-meta span:nth-child(2){width:100%}} /* v7.20 — Executive smart reports */ .executive-report-hero{background:linear-gradient(135deg,#063e36 0%,#0b6254 60%,#977128 100%);border-radius:24px;padding:25px 28px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:20px;box-shadow:0 18px 48px rgba(6,62,54,.2);position:relative;overflow:hidden}.executive-report-hero:after{content:"▥";position:absolute;inset-inline-end:35px;top:-50px;font-size:200px;color:rgba(255,255,255,.05);font-weight:900}.executive-report-hero h2{font-size:26px;margin:5px 0 7px}.executive-report-hero p{margin:0;color:#dcefeb}.executive-kicker{font-size:11px;font-weight:900;color:#f2d47d;letter-spacing:.6px}.executive-hero-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;position:relative;z-index:1}.executive-hero-actions .input{width:155px;background:rgba(255,255,255,.96)}.executive-scope-toolbar{flex-wrap:wrap} .executive-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.executive-kpi{background:var(--card,#fff);border:1px solid var(--border);border-top:3px solid var(--primary);border-radius:17px;padding:16px;box-shadow:var(--shadow)}.executive-kpi span{display:block;font-size:11px;color:var(--muted);font-weight:800}.executive-kpi strong{display:block;font-size:26px;color:var(--primary);margin:6px 0 3px}.executive-kpi small{color:var(--muted);font-size:10.5px}.executive-kpi.good{border-top-color:#1b9a68}.executive-kpi.warn{border-top-color:#d89b20}.executive-kpi.danger{border-top-color:#cf3c4d}.executive-kpi.danger strong{color:#b62e3e}.executive-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.executive-panel{padding:18px}.section-head.compact{margin-bottom:12px}.section-head.compact h3{margin:0 0 3px}.section-head.compact p{font-size:11px;margin:0;color:var(--muted)} .trend-bars{display:grid;gap:7px}.trend-row{display:grid;grid-template-columns:66px minmax(0,1fr) 34px;gap:8px;align-items:center;font-size:10.5px;color:var(--muted)}.trend-row>div{height:8px;background:var(--primary-light,#e8f4f0);border-radius:99px;overflow:hidden}.trend-row i{display:block;height:100%;background:linear-gradient(90deg,#0b6254,#c99a35);border-radius:99px}.trend-row b{color:var(--text);text-align:center}.rank-row{display:grid;grid-template-columns:28px minmax(0,1fr) 38px;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--border)}.rank-row>b{width:25px;height:25px;display:grid;place-items:center;border-radius:9px;background:var(--primary-light,#eaf5f2);color:var(--primary)}.rank-row span{font-size:12px;font-weight:750;min-width:0}.rank-row small{display:block;color:var(--muted);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rank-row strong{color:var(--primary)} .college-performance-list{display:grid;gap:9px}.college-performance-row{display:grid;grid-template-columns:34px minmax(160px,1.2fr) minmax(110px,1fr) minmax(310px,1.5fr);align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--border)}.college-rank{width:31px;height:31px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(145deg,#0b6254,#c8952f);color:#fff;font-weight:900}.college-performance-name strong{display:block;font-size:12px}.college-performance-name small{color:var(--muted);font-size:10px}.college-performance-bar{height:8px;background:var(--primary-light,#e8f4f0);border-radius:99px;overflow:hidden}.college-performance-bar i{display:block;height:100%;background:linear-gradient(90deg,#0b6254,#c8952f);border-radius:99px}.college-performance-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.college-performance-metrics span{background:var(--primary-light,#eef7f4);border-radius:9px;padding:6px;text-align:center;font-size:9.5px;color:var(--muted)}.college-performance-metrics b{display:block;color:var(--text);font-size:12px}.risk-list{display:grid;gap:8px;margin-top:12px}.risk-list>div,.risk-person{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:9px 10px;background:var(--primary-light,#eef7f4);border-radius:11px;font-size:11px}.risk-person span{min-width:0;font-weight:700}.risk-person small{display:block;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:340px}.risk-person b{color:#b62e3e;white-space:nowrap} html[data-theme="dark"] .executive-kpi,html[data-theme="dark"] .executive-panel{background:#13231f}html[data-theme="dark"] .college-performance-metrics span,html[data-theme="dark"] .risk-list>div,html[data-theme="dark"] .risk-person{background:#183029} @media(max-width:1100px){.executive-kpi-grid{grid-template-columns:repeat(2,1fr)}.college-performance-row{grid-template-columns:34px 1fr 1fr}.college-performance-metrics{grid-column:2/4}} @media(max-width:760px){.executive-report-hero{flex-direction:column;align-items:flex-start;padding:20px}.executive-hero-actions{width:100%}.executive-hero-actions .input{width:100%}.executive-hero-actions .btn{flex:1}.executive-kpi-grid,.executive-grid{grid-template-columns:1fr}.college-performance-row{grid-template-columns:34px 1fr}.college-performance-bar,.college-performance-metrics{grid-column:2}.college-performance-metrics{grid-template-columns:repeat(2,1fr)}} /* v7.22 Security Operations */ .security-score{min-width:130px;padding:18px 24px;border:1px solid rgba(255,255,255,.25);border-radius:20px;text-align:center;background:rgba(255,255,255,.1)} .security-score strong{display:block;font-size:34px}.security-score span{font-size:12px;opacity:.85} .security-check{padding:10px 0;border-bottom:1px solid var(--border,#e5e7eb)} .security-check:last-child{border-bottom:0} /* v7.25 Fast Circulation Desk */ .circulation-desk-hero{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:26px;border-radius:24px;background:linear-gradient(135deg,var(--primary-dark),var(--primary));color:#fff} .circulation-desk-hero h2{margin:5px 0}.desk-mode{display:flex;gap:8px}.desk-card{position:relative;overflow:hidden}.desk-step{position:absolute;inset-inline-end:18px;top:14px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#173b36;font-weight:900}.desk-scan{font-size:18px;font-weight:700;min-height:48px} @media(max-width:760px){.circulation-desk-hero{align-items:flex-start;flex-direction:column}.desk-mode{width:100%}.desk-mode .btn{flex:1}} /* v7.28 Library visual map */ .location-admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px} .location-admin-card h3{margin:8px 0 3px}.location-admin-card{border-top:3px solid var(--accent)} /* v7.29 Shelf preparation workflow */ .shelf-request-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:14px} .shelf-request-card{border-inline-start:4px solid var(--border)}.shelf-request-card.new{border-inline-start-color:var(--accent)}.shelf-request-card.preparing{border-inline-start-color:#d59b2f}.shelf-request-card.ready{border-inline-start-color:var(--success)} .shelf-location-pin{font-size:26px}.shelf-route{display:flex;flex-wrap:wrap;gap:7px}.shelf-route span{padding:6px 9px;border-radius:9px;background:rgba(18,94,82,.07);border:1px solid var(--border);font-size:12px} /* v7.29 member shelf requests */ .shelf-member-card{border-inline-start:4px solid var(--accent)}.shelf-member-card.preparing{border-inline-start-color:#d59b2f}.shelf-member-card.ready{border-inline-start-color:var(--success);background:rgba(26,145,101,.05)} /* v7.29.2 Original Wasit Logo — preserve official artwork, enhance presentation only */ img[src*="logo.png"], img[src*="logo-wasit-official.png"], img[src*="university-of-wasit-original-logo.png"]{ object-fit:contain; image-rendering:auto; } .brand-logo img, .login-logo img, .sidebar-logo img, .hero-logo img{ background:rgba(255,255,255,.96); border-radius:50%; padding:6px; box-shadow:0 8px 24px rgba(0,74,56,.16),0 0 0 2px rgba(194,153,31,.22); } /* v7.30 Smart Pickup Queue */ .pickup-board{display:grid;gap:12px}.pickup-ticket{display:grid;grid-template-columns:82px 1fr auto;gap:16px;align-items:center}.pickup-number{width:68px;height:68px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(192,145,34,.18),rgba(11,93,75,.10));font-size:28px;font-weight:900;color:var(--primary)}.pickup-ticket.arrived{border:2px solid var(--accent);box-shadow:0 0 0 4px rgba(192,145,34,.08)}.pickup-ticket.delivered{opacity:.72}.pickup-actions{display:flex;gap:7px;flex-wrap:wrap}@media(max-width:700px){.pickup-ticket{grid-template-columns:62px 1fr}.pickup-number{width:54px;height:54px}.pickup-actions{grid-column:1/-1}} /* v7.31 Queue display controls */ .pickup-command{display:flex;justify-content:space-between;align-items:center;gap:18px;background:linear-gradient(135deg,rgba(11,93,75,.08),rgba(192,145,34,.08))} .pickup-ticket.called{border:2px solid rgba(11,93,75,.45);box-shadow:0 0 0 4px rgba(11,93,75,.06)} @media(max-width:760px){.pickup-command{align-items:flex-start;flex-direction:column}.pickup-command .flex{width:100%}.pickup-command .btn{flex:1}} /* v7.32 Formal Inventory */ .inventory-official-hero{display:flex;justify-content:space-between;align-items:center;gap:18px;background:linear-gradient(135deg,rgba(11,93,75,.08),rgba(192,145,34,.07))} .inventory-cert{min-width:150px;border-radius:18px;padding:14px;text-align:center;border:1px solid var(--border)}.inventory-cert strong{display:block;font-size:19px}.inventory-cert span{display:block;font-size:11px;color:var(--muted);margin-top:4px}.inventory-cert.certified{background:rgba(30,150,100,.08);border-color:rgba(30,150,100,.3)}.inventory-cert.pending{background:rgba(192,145,34,.08)} .inventory-discrepancy-list{display:grid;gap:10px}.inventory-discrepancy{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:14px;border:1px solid var(--border);border-radius:14px}.inventory-discrepancy.pending{border-inline-start:4px solid #c04f4f}.inventory-discrepancy.resolved{border-inline-start:4px solid var(--success);background:rgba(30,150,100,.035)}.inventory-discrepancy h4{margin:7px 0 4px}.resolution-line{margin-top:7px;color:var(--success);font-size:12px;font-weight:700} @media(max-width:700px){.inventory-official-hero,.inventory-discrepancy{align-items:flex-start;flex-direction:column}.inventory-cert{width:100%}} /* v7.34 Executive Decision Center */ .executive-command-hero{display:flex;justify-content:space-between;align-items:center;gap:25px;background:linear-gradient(135deg,rgba(11,93,75,.12),rgba(192,145,34,.09))} .health-score{min-width:190px;text-align:center;padding:18px;border:1px solid rgba(192,145,34,.3);border-radius:22px;background:rgba(255,255,255,.55)}.health-score span,.health-score small{display:block;color:var(--muted)}.health-score strong{display:block;font-size:42px;color:var(--primary);line-height:1.15;margin:5px} .executive-section-title{display:flex;justify-content:space-between;align-items:end;margin:20px 2px 10px}.executive-section-title h3{margin:0}.executive-section-title span{font-size:12px;color:var(--muted)} .decision-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mini-bars{display:grid;gap:8px}.mini-bar-row{display:grid;grid-template-columns:95px 1fr 38px;gap:9px;align-items:center;font-size:11px}.mini-bar-row>div{height:9px;background:rgba(11,93,75,.08);border-radius:99px;overflow:hidden}.mini-bar-row i{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:99px}.mini-bar-row b{text-align:center} .risk-list{display:grid;gap:9px}.risk-item{display:flex;gap:10px;padding:12px;border-radius:13px;border:1px solid var(--border)}.risk-item p{margin:3px 0 0;color:var(--muted);font-size:11px}.risk-dot{width:11px;height:11px;border-radius:50%;margin-top:4px;flex:0 0 auto}.risk-item.high .risk-dot{background:#b84242}.risk-item.medium .risk-dot{background:#c09122}.success-empty{color:var(--success)} .rank-list{display:grid}.rank-row{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}.rank-row>span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(192,145,34,.12);font-weight:800}.rank-row b{font-size:11px;color:var(--primary)}.executive-summary p{line-height:1.8;color:var(--muted)} @media(max-width:850px){.decision-grid{grid-template-columns:1fr}.executive-command-hero{align-items:flex-start;flex-direction:column}.health-score{width:100%}} @media print{.sidebar,.topbar,.hero-actions,.btn{display:none!important}.app-shell{display:block!important}.main{margin:0!important}.content{padding:10px!important}.card,.kpi,.table-card{break-inside:avoid}} /* v7.35 Researcher Discovery Experience */ .unified-search-shell{padding:14px;border-radius:18px;background:linear-gradient(135deg,rgba(11,93,75,.07),rgba(192,145,34,.06));border:1px solid var(--border)} .search-autocomplete-wrap{position:relative;flex:1}.search-suggestions{position:absolute;z-index:30;top:calc(100% + 5px);inset-inline:0;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:0 18px 45px rgba(0,0,0,.12);overflow:hidden}.search-suggestions button{width:100%;display:flex;flex-direction:column;align-items:flex-start;padding:11px 13px;border:0;border-bottom:1px solid var(--border);background:transparent;text-align:start;cursor:pointer}.search-suggestions button:hover{background:rgba(11,93,75,.06)}.search-suggestions small{color:var(--muted);margin-top:3px} .smart-filter-row{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:9px}.smart-filter-row select{width:100%} .search-result-summary{display:flex;justify-content:space-between;gap:10px;padding:10px 3px;color:var(--muted);font-size:12px}.search-result-summary strong{color:var(--primary);font-size:14px} .favorite-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:transparent;font-size:22px;cursor:pointer;color:var(--muted)}.favorite-btn.active{color:#a77b16;background:rgba(192,145,34,.1);border-color:rgba(192,145,34,.35)} .researcher-personal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.researcher-side-card{padding:14px;border:1px solid var(--border);border-radius:16px}.researcher-side-card h3{margin:0 0 10px}.saved-search-item{width:100%;display:grid;grid-template-columns:26px 1fr;gap:8px;text-align:start;border:0;background:transparent;padding:8px;border-radius:10px;cursor:pointer}.saved-search-item:hover{background:rgba(11,93,75,.05)}.saved-search-item small{display:block;color:var(--muted);margin-top:2px}.history-chip{border:1px solid var(--border);border-radius:99px;background:transparent;padding:6px 10px;margin:3px;cursor:pointer}.similar-panel{border-inline-start:4px solid var(--accent)}.similar-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.similar-grid button{padding:11px;border:1px solid var(--border);border-radius:12px;background:transparent;text-align:start;cursor:pointer}.similar-grid small{display:block;color:var(--muted);margin-top:4px} @media(max-width:720px){.smart-filter-row,.researcher-personal-grid,.similar-grid{grid-template-columns:1fr}.search-result-summary{flex-direction:column}} /* v7.36 Professional Bibliographic Record */ .bib-modal-head{background:linear-gradient(135deg,rgba(11,93,75,.08),rgba(192,145,34,.08))}.bib-record{max-width:1180px;margin:auto}.bib-hero{display:grid;grid-template-columns:150px 1fr 125px;gap:22px;align-items:center;padding:18px;border:1px solid var(--border);border-radius:22px;background:linear-gradient(135deg,rgba(11,93,75,.055),rgba(255,255,255,.5))} .bib-cover{width:140px;height:195px;border-radius:14px;overflow:hidden;box-shadow:0 12px 28px rgba(0,0,0,.13);background:var(--surface)}.bib-cover img{width:100%;height:100%;object-fit:cover}.bib-cover-placeholder{height:100%;display:grid;place-items:center;align-content:center;gap:8px;background:linear-gradient(160deg,var(--primary),#163f39);color:#fff}.bib-cover-placeholder span{font-size:46px}.bib-identity h2{font-size:24px;line-height:1.5;margin:5px 0}.bib-subtitle,.bib-author{color:var(--muted);line-height:1.7}.bib-actions{display:flex;gap:7px;flex-wrap:wrap}.bib-qr-card{text-align:center;padding:10px;border:1px solid var(--border);border-radius:15px;background:#fff}.bib-qr-card img{width:96px;height:96px}.bib-qr-card small{display:block;color:#455f59;margin-top:5px} .bib-facts{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:12px}.bib-facts>div{padding:12px;border:1px solid var(--border);border-radius:13px}.bib-facts small{display:block;color:var(--muted);margin-bottom:5px}.bib-facts strong{font-size:12px}.bib-two-col{display:grid;grid-template-columns:1.15fr .85fr;gap:12px}.bib-table th{width:135px}.bib-abstract{line-height:2}.bib-location{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}.bib-location>span{font-size:20px}.bib-location small{display:block;color:var(--muted);margin-top:4px}.copy-status{padding:4px 8px;border-radius:99px;font-size:11px}.copy-status.available{background:rgba(33,135,90,.12);color:#18734d}.copy-status.loaned,.copy-status.reserved{background:rgba(192,145,34,.14);color:#86620d}.copy-status.damaged,.copy-status.lost{background:rgba(184,66,66,.12);color:#a03333}.copy-status.maintenance{background:rgba(50,100,160,.12)}.copy-status.withdrawn{background:rgba(90,90,90,.12);color:#555} .bib-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.bib-tools button,.bib-tools a{display:flex;flex-direction:column;gap:4px;text-align:start;padding:15px;border:1px solid var(--border);border-radius:15px;background:transparent;color:inherit;text-decoration:none;cursor:pointer}.bib-tools span{font-size:20px;color:var(--primary);font-weight:800}.bib-tools small{color:var(--muted)}.bib-related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.bib-related-card{padding:13px;border:1px solid var(--border);border-radius:14px;background:var(--surface);text-align:start;cursor:pointer}.bib-related-card>span{font-size:10px;color:var(--accent);font-weight:700}.bib-related-card strong,.bib-related-card small{display:block;margin-top:5px}.bib-related-card small{color:var(--muted)} @media(max-width:900px){.bib-hero{grid-template-columns:110px 1fr}.bib-cover{width:105px;height:150px}.bib-qr-card{display:none}.bib-facts{grid-template-columns:repeat(3,1fr)}.bib-related-grid{grid-template-columns:1fr 1fr}} @media(max-width:650px){.bib-hero,.bib-two-col{grid-template-columns:1fr}.bib-cover{margin:auto}.bib-facts,.bib-tools,.bib-related-grid{grid-template-columns:1fr}.bib-identity{text-align:center}.bib-actions{justify-content:center}} /* v7.37 Smart Import & Catalog Quality */ .smart-import-kpis .kpi{min-height:105px}.import-health{display:flex;flex-direction:column;gap:5px;margin:12px 0;padding:13px 15px;border-radius:14px;border:1px solid var(--border)}.import-health.good{background:rgba(33,135,90,.07);border-color:rgba(33,135,90,.25)}.import-health.bad{background:rgba(184,66,66,.07);border-color:rgba(184,66,66,.25)}.import-health span{font-size:12px;color:var(--muted)}.quality-dot{display:inline-block;padding:4px 8px;border-radius:99px;font-size:10px;font-weight:800}.quality-dot.danger{background:rgba(184,66,66,.12);color:#a03333}.quality-dot.warning{background:rgba(192,145,34,.13);color:#86620d} /* v7.38 Database Quality Center */ .quality-coverage-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:13px 0}.quality-coverage-grid>div{padding:13px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.quality-coverage-grid span,.quality-coverage-grid strong{display:block}.quality-coverage-grid span{font-size:11px;color:var(--muted)}.quality-coverage-grid strong{font-size:22px;margin:4px 0;color:var(--primary)}.quality-coverage-grid i{display:block;height:6px;border-radius:99px;background:rgba(11,93,75,.08);overflow:hidden}.quality-coverage-grid i b{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:99px}.quality-tile.critical.has-issues{border-color:rgba(184,66,66,.35);box-shadow:inset 0 0 0 1px rgba(184,66,66,.06)}.block{display:block;margin-top:4px} @media(max-width:800px){.quality-coverage-grid{grid-template-columns:1fr 1fr}}@media(max-width:480px){.quality-coverage-grid{grid-template-columns:1fr}} /* v7.39 Safe Duplicate Merge */ .duplicate-compare{max-width:1050px}.duplicate-heads{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.duplicate-heads>div{padding:13px;border:1px solid var(--border);border-radius:14px;background:rgba(11,93,75,.035)}.duplicate-heads span,.duplicate-heads strong,.duplicate-heads small{display:block}.duplicate-heads span{font-size:10px;color:var(--accent);font-weight:800}.duplicate-heads strong{margin:5px 0}.duplicate-heads small{color:var(--muted)}.compare-table th:first-child{width:130px}.compare-table td{max-width:330px;white-space:normal;line-height:1.6}@media(max-width:700px){.duplicate-heads{grid-template-columns:1fr}} /* v7.40 Disaster Recovery */ .dr-score{min-width:120px;text-align:center;padding:12px 16px;border-radius:18px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.25)}.dr-score strong{display:block;font-size:32px}.dr-score span{font-size:11px;opacity:.85}.recovery-steps{margin:8px 18px 0;line-height:2;color:var(--muted)}.recovery-steps code{font-size:11px} /* v7.41 Platform Health & Preventive Maintenance */ .maintenance-hero{display:flex;align-items:center;gap:20px;justify-content:space-between;padding:22px;border-radius:22px;background:linear-gradient(135deg,#0b5d4b,#174c44);color:#fff}.maintenance-hero h2{margin:4px 0}.maintenance-hero p{opacity:.84;margin:0}.maintenance-score{min-width:120px;text-align:center;padding:12px 16px;border:1px solid rgba(255,255,255,.25);border-radius:18px;background:rgba(255,255,255,.1)}.maintenance-score strong{display:block;font-size:32px}.maintenance-score span{font-size:11px;opacity:.85}.ops-health-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.ops-health-grid>div{padding:12px;border:1px solid var(--border);border-radius:12px}.ops-health-grid strong,.ops-health-grid span{display:block}.ops-health-grid strong{font-size:22px;color:var(--primary)}.ops-health-grid span{font-size:11px;color:var(--muted)}.health-service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.health-service{padding:13px;border:1px solid var(--border);border-inline-start:4px solid var(--warning);border-radius:13px}.health-service.ready,.health-service.configured{border-inline-start-color:var(--success)}.health-service.error{border-inline-start-color:var(--danger)}.health-service p{font-size:12px;color:var(--muted);min-height:34px}.health-service small{color:var(--muted)}@media(max-width:850px){.maintenance-hero{align-items:flex-start;flex-direction:column}.health-service-grid{grid-template-columns:1fr 1fr}}@media(max-width:550px){.health-service-grid,.ops-health-grid{grid-template-columns:1fr}} /* v7.42 Institutional Setup Wizard */ .setup-wizard{max-width:980px}.setup-progress{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:18px}.setup-progress>div{text-align:center;color:var(--muted);font-size:9px}.setup-progress b{width:28px;height:28px;margin:0 auto 5px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--border)}.setup-progress .active b{background:var(--primary);color:#fff;border-color:var(--primary)}.setup-progress .done b{background:rgba(33,135,90,.12);color:var(--success);border-color:rgba(33,135,90,.3)}.setup-panel{padding:16px;border:1px solid var(--border);border-radius:16px}.setup-checklist{display:grid;gap:8px}.setup-checklist>div{display:flex;gap:10px;align-items:center;padding:11px;border:1px solid var(--border);border-radius:12px}.setup-checklist>div>span{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;font-weight:800}.setup-checklist .ok>span{background:rgba(33,135,90,.12);color:var(--success)}.setup-checklist .warn>span{background:rgba(192,145,34,.13);color:#86620d}.setup-checklist small{display:block;color:var(--muted);margin-top:3px}.setup-final-score{width:130px;height:130px;border-radius:50%;display:grid;place-items:center;margin:10px auto;background:linear-gradient(135deg,var(--primary),#174c44);color:#fff;font-size:32px;font-weight:800}.setup-summary{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}.setup-summary span{padding:7px 10px;border-radius:99px;border:1px solid var(--border);font-size:11px}.setup-summary .ok{color:var(--success)}.setup-summary .warn{color:#86620d}@media(max-width:700px){.setup-progress{grid-template-columns:repeat(4,1fr)}} /* v7.43 Today Work Center */ .today-desk{padding:16px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(135deg,rgba(11,93,75,.035),rgba(192,145,34,.025))}.today-columns{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.today-card{padding:12px;border:1px solid var(--border);border-radius:15px;background:var(--surface);min-height:150px}.today-card.danger{border-color:rgba(184,66,66,.28)}.today-card-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:9px;border-bottom:1px solid var(--border)}.today-card-head b{min-width:27px;height:27px;padding:0 6px;border-radius:99px;display:grid;place-items:center;background:rgba(11,93,75,.09);color:var(--primary)}.today-card.danger .today-card-head b{background:rgba(184,66,66,.1);color:var(--danger)}.today-card>button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:7px;padding:9px 2px;border:0;border-bottom:1px dashed var(--border);background:transparent;color:inherit;text-align:start;cursor:pointer}.today-card>button span,.today-card>button strong,.today-card>button small{display:block}.today-card>button small{margin-top:2px;color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}.today-card>button i{font-style:normal;font-size:10px;color:var(--primary);font-weight:800}.today-card>p{padding-top:15px;text-align:center;font-size:11px}@media(max-width:1050px){.today-columns{grid-template-columns:1fr 1fr}}@media(max-width:620px){.today-columns{grid-template-columns:1fr}} /* v7.44 Personalized Member Experience */ .recommendation-section{background:linear-gradient(135deg,rgba(192,145,34,.045),rgba(11,93,75,.035))}.recommendation-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.recommendation-strip article{padding:14px;border:1px solid var(--border);border-radius:15px;background:var(--surface);display:flex;flex-direction:column;gap:7px;min-height:165px}.recommendation-strip article>strong{line-height:1.5}.recommendation-strip article>small{color:var(--muted);min-height:30px}.recommendation-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:rgba(11,93,75,.08);font-size:20px}.recommendation-strip article>.flex{margin-top:auto}@media(max-width:1000px){.recommendation-strip{grid-template-columns:1fr 1fr}}@media(max-width:580px){.recommendation-strip{grid-template-columns:1fr}} /* v7.45 Smart Arabic/English Search */ .smart-ranked-result{position:relative}.relevance-score{margin-inline-start:auto;min-width:42px;padding:4px 7px;border-radius:99px;background:rgba(11,93,75,.09);color:var(--primary);font-size:10px;font-weight:800;text-align:center}.match-reasons{display:flex;flex-wrap:wrap;gap:5px;margin:7px 0}.match-reasons span{padding:4px 7px;border-radius:8px;background:rgba(11,93,75,.055);border:1px solid rgba(11,93,75,.1);color:var(--primary);font-size:9px}.search-result-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.search-result-summary span{color:var(--muted);font-size:11px}@media(max-width:600px){.search-result-summary{align-items:flex-start;flex-direction:column}} /* v7.47 Collection Intelligence */ .analytics-command{background:linear-gradient(135deg,rgba(11,93,75,.025),rgba(192,145,34,.02))}.analytics-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:12px}.analytics-kpis>div{padding:12px;border:1px solid var(--border);border-radius:13px;text-align:center}.analytics-kpis strong,.analytics-kpis span{display:block}.analytics-kpis strong{font-size:24px;color:var(--primary)}.analytics-kpis span{font-size:10px;color:var(--muted)}.analytics-kpis .warn strong{color:#9a6516}.analytics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.analytics-grid>section{padding:13px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.analytics-grid h4{margin:0 0 10px}.analytics-row{display:grid;grid-template-columns:minmax(0,1fr) 80px 32px;gap:7px;align-items:center;padding:5px 0}.analytics-row>span{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.analytics-row i{height:5px;background:rgba(11,93,75,.07);border-radius:99px;overflow:hidden}.analytics-row i b{display:block;height:100%;background:var(--primary);border-radius:99px}.analytics-row>strong{text-align:end;font-size:10px}.unmet-panel{border-color:rgba(192,145,34,.28)!important}.unmet-panel .analytics-row i b{background:#a97518}.analytics-subject{padding:6px 0;border-bottom:1px dashed var(--border)}.analytics-subject strong,.analytics-subject span{display:block}.analytics-subject span{font-size:9px;color:var(--muted);margin-top:2px}.analytics-lowuse{margin-top:10px;border:1px solid var(--border);border-radius:13px;padding:10px}.analytics-lowuse summary{cursor:pointer;font-weight:800}@media(max-width:1000px){.analytics-grid{grid-template-columns:1fr 1fr}.analytics-kpis{grid-template-columns:repeat(3,1fr)}}@media(max-width:620px){.analytics-grid,.analytics-kpis{grid-template-columns:1fr}} /* v7.48 Critical Fix Pack: barcode batches, permissions, college map */ .permission-matrix-wrap{overflow:auto}.permission-matrix th,.permission-matrix td{text-align:center;vertical-align:middle}.permission-matrix th:first-child,.permission-matrix td:first-child{text-align:start;min-width:210px}.permission-matrix td:first-child small{display:block;color:var(--muted);margin-top:3px}.perm-reset{display:block;margin:5px auto 0;border:0;background:transparent;cursor:pointer;color:var(--muted)}.perm-switch{display:inline-grid;place-items:center;cursor:pointer}.perm-switch input{position:absolute;opacity:0;pointer-events:none}.perm-switch span{width:38px;height:30px;border-radius:10px;display:grid;place-items:center;background:rgba(120,120,120,.08);border:1px solid var(--border);font-weight:800}.perm-switch input:checked+span{background:rgba(33,135,90,.13);border-color:rgba(33,135,90,.35);color:var(--success)}.perm-switch.locked{opacity:.65;cursor:not-allowed} .college-map-canvas{min-height:470px;padding:14px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(90deg,rgba(11,93,75,.025) 1px,transparent 1px),linear-gradient(rgba(11,93,75,.025) 1px,transparent 1px);background-size:32px 32px}.college-map-header{display:flex;justify-content:space-between;gap:10px;padding:5px 3px 12px;color:var(--muted)}.map-floor-plan{position:relative;height:390px;border:2px solid rgba(11,93,75,.18);border-radius:15px;background:rgba(255,255,255,.55);overflow:hidden}.map-room{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;border:2px solid rgba(11,93,75,.3);border-radius:14px;background:linear-gradient(145deg,rgba(11,93,75,.09),rgba(192,145,34,.08));color:inherit;cursor:pointer;padding:8px;text-align:center;overflow:hidden}.map-room:hover{box-shadow:0 10px 25px rgba(0,0,0,.09);transform:translateY(-1px)}.map-room span{font-size:10px;color:var(--accent);font-weight:800}.map-room small{font-size:9px;color:var(--muted)}.map-entrance{position:absolute;bottom:0;left:50%;transform:translateX(-50%);padding:5px 18px;border-radius:10px 10px 0 0;background:var(--primary);color:#fff;font-size:11px} .label-filter-card .grid-4{align-items:end}.label-batch-nav{display:flex;align-items:center;justify-content:center;gap:16px}.label-batch-nav strong{min-width:260px;text-align:center}.label-hero{margin-bottom:12px}@media print{.label-hero,.label-filter-card,.label-batch-nav,.sidebar,.topbar{display:none!important}.label-sheet{display:grid!important}.print-label{break-inside:avoid}} @media(max-width:750px){.map-floor-plan{height:520px}.permission-matrix{min-width:900px}.label-batch-nav{flex-wrap:wrap}.label-batch-nav strong{order:-1;width:100%}} .public-college-map{position:relative;height:360px;margin:12px 0;border:2px solid rgba(11,93,75,.18);border-radius:16px;background:linear-gradient(90deg,rgba(11,93,75,.025) 1px,transparent 1px),linear-gradient(rgba(11,93,75,.025) 1px,transparent 1px);background-size:28px 28px;overflow:hidden}.public-map-room{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;border:1px solid rgba(11,93,75,.22);border-radius:12px;background:rgba(11,93,75,.07);padding:6px}.public-map-room.active{border:3px solid var(--accent);background:rgba(192,145,34,.13);box-shadow:0 0 0 5px rgba(192,145,34,.07)}.public-map-room span{font-size:20px}.public-map-room small{font-size:9px;color:var(--muted)}.public-map-entry{position:absolute;bottom:0;left:50%;transform:translateX(-50%);padding:5px 18px;background:var(--primary);color:white;border-radius:10px 10px 0 0} /* v7.49 Account Isolation & Request Service Control */ .requests-command{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px;border-radius:20px;background:linear-gradient(135deg,#0b5d4b,#174c44);color:#fff}.requests-command h2{margin:4px 0}.requests-command p{margin:0;opacity:.86}.service-state-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.service-state-grid>div{padding:12px;border:1px solid var(--border);border-radius:13px}.service-state-grid strong,.service-state-grid span{display:block}.service-state-grid span{font-size:10px;margin-top:4px}.service-state-grid .on{background:rgba(33,135,90,.06);border-color:rgba(33,135,90,.22)}.service-state-grid .on span{color:var(--success)}.service-state-grid .off{background:rgba(184,66,66,.05);border-color:rgba(184,66,66,.2)}.service-state-grid .off span{color:var(--danger)}.unified-request-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.shelf-request-grid.compact{display:grid;gap:8px}.shelf-request-grid.compact .shelf-request-card{border:1px solid var(--border);border-radius:13px;padding:12px}.pickup-help{display:flex;justify-content:space-between;align-items:center;gap:16px;background:rgba(11,93,75,.04)}.service-settings-list{display:grid;gap:9px}.service-settings-list label{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:start;padding:12px;border:1px solid var(--border);border-radius:12px}.service-settings-list label input{grid-row:1/3;margin-top:3px}.service-settings-list label small{display:block;color:var(--muted);margin-top:3px}.block{display:block}.college-command-actions select{min-width:210px}@media(max-width:900px){.unified-request-grid{grid-template-columns:1fr}.service-state-grid{grid-template-columns:1fr 1fr}.requests-command,.pickup-help{align-items:flex-start;flex-direction:column}}@media(max-width:520px){.service-state-grid{grid-template-columns:1fr}} /* v7.49.1 Alerts screen fix */ .alerts-hero{margin-bottom:14px}.alerts-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.alert-section{min-height:220px}.alert-section.alert-danger{border-inline-start:4px solid var(--danger)}.alert-section.alert-warning{border-inline-start:4px solid #b5831f}.alert-section.alert-ready{border-inline-start:4px solid var(--success)}.alert-list{display:grid;gap:7px}.alert-list article{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border:1px solid var(--border);border-radius:12px}.alert-list article strong,.alert-list article small{display:block}.alert-list article small{color:var(--muted);margin-top:3px;font-size:10px}.alert-help p{color:var(--muted);margin:6px 0 0;line-height:1.7}@media(max-width:800px){.alerts-grid{grid-template-columns:1fr}} /* v7.49.4 Member catalog search UX */ .member-search-context{margin:12px 0 4px;padding:12px 14px;border:1px solid rgba(13,79,156,.16);border-radius:14px;background:linear-gradient(135deg,rgba(13,79,156,.05),rgba(17,176,121,.04));display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center;scroll-margin-top:90px}.member-search-context>span{font-size:11px;color:var(--muted)}.member-search-context>strong{font-size:15px;color:var(--primary)}.member-search-context>small{grid-column:2;color:var(--muted)}.member-search-secondary{margin-top:18px!important;padding-top:14px;border-top:1px solid var(--border)}.member-suggest-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-bottom:1px solid var(--border);font-size:10px;color:var(--muted);position:sticky;top:0;background:var(--surface);z-index:2}.member-suggest-head button{width:auto!important;padding:3px 8px!important;border-radius:8px!important;background:rgba(11,93,75,.06)!important}.member-search-as-typed{font-weight:800!important;color:var(--primary)!important;border-bottom:1px dashed var(--border)!important}.search-autocomplete-wrap .search-suggestions{max-height:270px;overflow:auto}.search-autocomplete-wrap{position:relative}.search-autocomplete-wrap #lib-suggestions{position:relative;z-index:50}@media(max-width:600px){.member-search-context{grid-template-columns:1fr}.member-search-context>small{grid-column:1}} /* v7.49.7 Loan source, library location, and membership ownership */ .member-loan-source-summary{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:12px 0 16px;padding:13px 15px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(135deg,rgba(11,93,75,.045),rgba(13,79,156,.04))}.member-loan-source-summary strong,.member-loan-source-summary small{display:block}.member-loan-source-summary small{margin-top:3px;color:var(--muted)}.loan-source-chips{display:flex;gap:7px;flex-wrap:wrap}.loan-source-chips span,.loan-source-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:99px;background:rgba(11,93,75,.09);color:var(--primary);font-size:10px;font-weight:800}.loan-source-chips b{min-width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:var(--surface)}.loan-source-line{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:8px;font-size:10px;color:var(--muted)}.member-loan-actions{display:flex;flex-direction:column;gap:7px;align-items:flex-end}.member-source-mini{display:block;margin-top:4px;color:var(--muted);font-size:9px;max-width:180px;white-space:normal}.desk-loan-sources,.loan-source-confirm{margin-top:7px;padding:7px 9px;border-radius:10px;background:rgba(11,93,75,.055);font-size:11px}.member-modal{max-width:820px}.loan-location-summary{padding:12px;border:1px solid var(--border);border-radius:13px;margin-bottom:10px}.loan-location-summary strong{font-size:17px}.loan-location-summary p{margin:5px 0;line-height:1.7}.loan-location-map{position:relative;height:330px;border:2px solid rgba(11,93,75,.18);border-radius:16px;background:linear-gradient(90deg,rgba(11,93,75,.03) 1px,transparent 1px),linear-gradient(rgba(11,93,75,.03) 1px,transparent 1px);background-size:28px 28px;overflow:hidden}.loan-map-marker{position:absolute;transform:translate(-50%,-50%);min-width:95px;padding:8px 10px;border:2px solid var(--accent);border-radius:13px;background:#fff7df;text-align:center;font-size:22px;box-shadow:0 8px 22px rgba(0,0,0,.12)}.loan-map-marker span{display:block;margin-top:2px;font-size:10px;font-weight:800}.loan-map-entry{position:absolute;bottom:0;left:50%;transform:translateX(-50%);padding:5px 18px;border-radius:10px 10px 0 0;background:var(--primary);color:#fff}.loan-map-empty{height:100%;display:grid;place-items:center;color:var(--muted)}.member-location-coordinate{margin-top:9px;text-align:center;color:var(--muted)}.block{display:block} @media(max-width:700px){.member-loan-source-summary{align-items:flex-start;flex-direction:column}.member-loan-actions{align-items:stretch}.loan-location-map{height:280px}} /* v7.49.8 — Unified authenticated catalog ownership/location */ .member-result-location{margin-top:9px;padding:8px 10px;border:1px dashed rgba(11,93,75,.22);border-radius:11px;background:rgba(11,93,75,.035);font-size:10px;line-height:1.7;color:var(--muted)}.member-result-location strong{color:var(--text);font-weight:750}.reservation-owner-card{padding:16px;border:1px solid rgba(11,93,75,.2);border-radius:16px;background:linear-gradient(135deg,rgba(11,93,75,.06),rgba(13,79,156,.04))}.reservation-owner-card>span{display:block;color:var(--muted);font-size:10px}.reservation-owner-card>strong{display:block;margin:4px 0 8px;font-size:19px;color:var(--primary)}.reservation-owner-card p{margin:5px 0;line-height:1.7}.reservation-owner-card small{display:block;margin-top:8px;color:var(--muted)} /* v7.49.9 — hard university-wide member catalog + owner-library workflow */ .member-fixed-catalog-scope{display:flex;align-items:center;justify-content:center;min-height:42px;padding:8px 12px;border:1px solid rgba(13,79,156,.18);border-radius:11px;background:rgba(13,79,156,.05);color:var(--primary);font-size:11px;font-weight:800}.owner-library-line{margin-top:5px;color:var(--primary)}.owner-library-line strong{font-weight:800}