:root{--primary-color: #1a4d7a;--secondary-color: #d4af37;--bg-color: #f8f9fa;--text-color: #333;--card-shadow: 0 10px 30px rgba(0, 0, 0, .1);--font-main: "Cairo", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-color);color:var(--text-color);direction:rtl;min-height:100vh;display:flex;justify-content:center;align-items:center;overflow-x:hidden;background-image:radial-gradient(at 10% 10%,rgba(26,77,122,.05) 0px,transparent 50%),radial-gradient(at 90% 90%,rgba(212,175,55,.1) 0px,transparent 50%)}#root{width:100%;max-width:1200px;padding:2rem;margin:0 auto}h1,h2,h3{font-weight:700;color:var(--primary-color)}button{font-family:var(--font-main);cursor:pointer;border:none;outline:none;transition:all .3s ease}input{font-family:var(--font-main)}.card-container{width:100%;max-width:480px;position:relative;overflow:hidden;box-shadow:0 10px 30px #0003;border-radius:8px;background:#fff}.card-container:before{display:none}.card-template-image{width:100%;height:auto;display:block;image-rendering:-webkit-optimize-contrast}.overlay-text{position:absolute;color:#1a4d7a;font-weight:700;font-size:1.2rem;z-index:10;white-space:nowrap;padding:0}.student-name{top:36%;right:31%;font-size:1.1rem;color:#1a4d7a;font-family:Cairo,sans-serif}.seat-number{top:49.5%;right:49%;font-size:1.3rem;color:#1a4d7a;font-family:Cairo,sans-serif}.student-class{top:63%;right:48%;font-size:1.3rem;color:#1a4d7a;font-family:Cairo,sans-serif}.committee-number{top:70%;right:48%;font-size:1.1rem;color:#1a4d7a;font-family:Cairo,sans-serif;font-weight:700}.attendance-sheet-wrapper{width:210mm;min-height:297mm;padding:10mm 12mm;background:#fff;color:#000;font-family:Cairo,sans-serif;direction:rtl;box-sizing:border-box;margin:0 auto;position:relative;box-shadow:0 0 10px #0000001a;border:3px double #000}.attendance-sheet-wrapper.background-mode{padding:0;background-size:100% 100%;background-repeat:no-repeat;overflow:hidden}.overlay-field{position:absolute;font-weight:800;color:#000;font-size:22pt;white-space:nowrap}.table-overlay-container{position:absolute;width:100%;top:0;left:0;right:0}.table-row-overlay{position:absolute;width:100%;height:0;font-size:12pt;color:#000;font-weight:700;display:flex;align-items:center}.cell-overlay{position:absolute;white-space:nowrap;top:50%;transform:translateY(-50%)}.sheet-header{display:flex;flex-direction:column;align-items:center;border-bottom:3px solid #000;padding-bottom:6mm;margin-bottom:6mm;text-align:center;position:relative}.header-logos-row{width:100%;display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:5mm;padding:0 5mm}.logo-left{flex:1;text-align:right;font-size:10pt;font-weight:700}.vision-logo-text{font-size:12pt;font-weight:900;color:#063;margin-bottom:2mm}.saudi-text{font-size:9pt;margin-bottom:1mm}.saudi-text-en{font-size:7pt;color:#666}.logo-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.bw-logo{width:32mm;height:32mm;object-fit:contain;filter:grayscale(100%) contrast(150%);margin-bottom:2mm}.school-slogan{font-size:8pt;color:#333;font-weight:600;text-align:center;line-height:1.4}.logo-right{flex:1;text-align:left;font-size:10pt;font-weight:700}.ministry-text{font-size:11pt;font-weight:800}.header-main-text{width:100%;margin-bottom:4mm}.title-official{font-size:24pt;font-weight:900;margin:6mm 0 2mm;text-decoration:underline;line-height:1.5}.header-details-row{width:100%;display:flex;justify-content:space-around;flex-wrap:wrap;gap:3mm;font-size:12pt;font-weight:700;margin-top:3mm;padding:3mm 2mm;background-color:#f9f9f9;border-radius:4px;border:1px solid #ddd}.school-name{font-size:18pt;font-weight:900;margin-bottom:2mm;line-height:1.4}.school-section{font-size:14pt;font-weight:700;margin-bottom:3mm;color:#333}.exam-period{font-size:12pt;line-height:1.5;margin-bottom:3mm;font-weight:700}.attendance-table{width:100%;border-collapse:collapse;margin-bottom:5mm;border:2px solid #000}.attendance-table th,.attendance-table td{border:1px solid #000;padding:3mm 2mm;text-align:center;font-size:11pt;line-height:1.6;vertical-align:middle}.attendance-table th{background-color:#e8e8e8;font-weight:900;font-size:12pt;padding:4mm 2mm}.student-name-cell{text-align:right!important;padding-right:5mm!important;padding-left:3mm!important;font-weight:700;min-height:8mm;font-size:11pt}.signature-cell{background-color:transparent;min-height:8mm;border-left:1px dashed #999}.sheet-footer{display:flex;justify-content:space-between;margin-top:8mm;padding:5mm;border-top:2px solid #000;background-color:#fafafa}.committee-official-section{font-size:12pt;font-weight:700}.committee-official-section p{margin:2mm 0;line-height:1.8}.principal-section{text-align:center;font-size:12pt;font-weight:700}.principal-section p{margin:2mm 0;line-height:1.8}.footer-line{margin-top:10mm;border-top:1px solid #000;width:100%}@media print{body *{visibility:hidden}.attendance-sheet-wrapper,.attendance-sheet-wrapper *{visibility:visible}.attendance-sheet-wrapper{position:absolute;left:0;top:0;margin:0;padding:5mm}}@page{size:A4 portrait;margin:0}:root{--primary-color: #1a4d7a;--secondary-color: #d4af37;--navy: #1a4d7a;--gold: #d4af37;--background: #f8f9fa;--card-shadow: 0 10px 30px rgba(0, 0, 0, .08)}.app-container{display:flex;flex-direction:column;align-items:center;gap:2rem;width:100%;padding:2rem}.header{text-align:center;margin-bottom:2rem}.header h1{font-size:2.8rem;margin-bottom:.5rem;background:linear-gradient(135deg,var(--navy),var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:800}.header p{color:#666;font-size:1.1rem}.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;width:100%;align-items:start}@media(max-width:1024px){.content-grid{grid-template-columns:1fr}}.panel{background:#fff;padding:2.5rem;border-radius:24px;box-shadow:var(--card-shadow);border:1px solid rgba(0,0,0,.05);animation:fadeIn .6s cubic-bezier(.23,1,.32,1)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.nav-tabs{display:flex;justify-content:center;gap:.8rem;margin-top:2.5rem;padding:8px;background:#ffffffb3;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(212,175,55,.2);border-radius:50px;width:fit-content;margin-left:auto;margin-right:auto;box-shadow:0 8px 32px #0000000f}.nav-tabs button{padding:12px 32px;border:none;background:transparent;color:var(--navy);font-weight:700;cursor:pointer;border-radius:40px;transition:all .4s cubic-bezier(.175,.885,.32,1.275);display:flex;align-items:center;gap:10px;font-family:Cairo,sans-serif;font-size:1rem;opacity:.8}.nav-tabs button.active{background:linear-gradient(135deg,var(--navy),#2c3e50);color:#fff;box-shadow:0 10px 20px #1a4d7a4d;transform:translateY(-3px) scale(1.03);opacity:1}.nav-tabs button:hover:not(.active){background:#1a4d7a14;opacity:1}.committee-main-grid{display:grid;grid-template-columns:400px 1fr;gap:2rem;width:100%}@media(max-width:1200px){.committee-main-grid{grid-template-columns:1fr}}.committee-list{display:flex;flex-direction:column;gap:1rem;max-height:600px;overflow-y:auto;padding-right:10px}.committee-card{background:#fff;padding:1.5rem;border-radius:18px;border:2px solid transparent;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #00000008}.committee-card:hover{transform:translate(-8px);border-color:#d4af374d}.committee-card.active{border-color:var(--gold);background:#fdfaf3;box-shadow:0 8px 25px #d4af3726}.committee-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem}.committee-title{font-size:1.2rem;font-weight:800;color:var(--navy)}.committee-info{display:flex;justify-content:space-between;font-size:.9rem;color:#666}.table-wrapper{background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--card-shadow);border:1px solid #eee}.styled-table{width:100%;border-collapse:collapse;text-align:right}.styled-table thead tr{background-color:var(--navy);color:#fff;text-align:right;font-weight:700}.styled-table th,.styled-table td{padding:15px 20px}.styled-table tbody tr{border-bottom:1px solid #f3f3f3;transition:background .2s}.styled-table tbody tr:hover{background-color:#fcf9f0}.styled-table tbody tr:last-of-type{border-bottom:2px solid var(--navy)}#report-to-export{width:210mm;padding:20mm;background:#fff;direction:rtl;font-family:Cairo,sans-serif;color:#333}.report-header-design{display:flex;justify-content:space-between;align-items:center;border-bottom:4px solid var(--navy);padding-bottom:20px;margin-bottom:30px}.report-logo-text{text-align:center}.report-logo-text h2{font-size:28pt;color:var(--navy);margin:0}.report-meta-box{background:#f8f9fa;border:1px solid #ddd;padding:20px;border-radius:12px;display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:30px}.meta-item{font-size:14pt}.btn-add-st{background:linear-gradient(135deg,#27ae60,#2ecc71);color:#fff;box-shadow:0 3px 10px #2ecc7133}.btn-add-st:hover{transform:translateY(-2px);box-shadow:0 5px 15px #2ecc714d}.btn-remove-st{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;box-shadow:0 3px 10px #e74c3c33}.btn-remove-st:hover{transform:translateY(-2px);box-shadow:0 5px 15px #e74c3c4d}.input-field{padding:12px 16px;border:2px solid #e0e0e0;border-radius:10px;font-family:Cairo,sans-serif;font-size:1rem;transition:all .3s ease;width:100%}.input-field:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 3px #d4af371a}.search-box input{width:100%;padding:12px 20px;border:2px solid #e0e0e0;border-radius:25px;font-family:Cairo,sans-serif;font-size:.95rem;transition:all .3s ease}.search-box input:focus{border-color:var(--navy);outline:none;box-shadow:0 0 0 3px #1a4d7a1a}.committee-badge{background:linear-gradient(135deg,var(--gold),#b8941f);color:#fff;padding:4px 12px;border-radius:12px;font-size:.8rem;font-weight:700}.preview-field,.table-row-field{position:absolute;-webkit-user-select:none;user-select:none;pointer-events:auto}.preview-field:hover,.table-row-field:hover{background-color:#d4af371a;border:1px dashed rgba(212,175,55,.5);border-radius:4px;padding:2px 4px}
