/* YAYASAN MIFTAHUL ULUM — Modern Islamic Academic UI system */
:root{--ym-green:#14532d;--ym-deep:#103b25;--ym-gold:#c8a45d;--ym-ivory:#f8f7f2;--ym-ink:#1f2937;--ym-muted:#64748b;--ym-line:#e5e7eb;--ym-shadow:0 18px 48px rgba(18,45,28,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:92px}body{font-family:'Plus Jakarta Sans',Inter,system-ui,sans-serif;color:var(--ym-ink);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}a{transition:color .2s,background .2s,border-color .2s,transform .2s,box-shadow .2s} :focus-visible{outline:3px solid rgba(200,164,93,.85)!important;outline-offset:3px!important}img{max-width:100%}
/* Public homepage */
.site-header{background:rgba(255,255,255,.94);backdrop-filter:blur(18px);border-bottom:1px solid #e9ece5;box-shadow:0 4px 24px rgba(20,50,30,.035)}.navbar{height:84px}.brand{gap:14px}.brand img{width:50px;height:50px;border:1px solid #e8e6dc;border-radius:14px;padding:3px;background:#fff;box-shadow:0 4px 12px rgba(20,50,30,.07)}.brand-title strong{font-size:15px;letter-spacing:-.04em;color:var(--ym-green)}.brand-title span{font-size:11px;letter-spacing:.02em}.nav-menu{gap:clamp(12px,1.7vw,25px)}.nav-menu a{font-size:13px;font-weight:700;color:#526257}.nav-menu a:hover{color:var(--ym-gold)}
.hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 82% 20%,rgba(200,164,93,.18),transparent 27%),linear-gradient(120deg,#102f20 0%,#16452b 52%,#1c5836 100%);padding:clamp(66px,8vw,112px) 0 clamp(62px,7vw,90px);border:0;color:#fff}.hero:before{content:"";position:absolute;z-index:-1;width:650px;height:650px;border:1px solid rgba(255,255,255,.10);border-radius:50%;right:-220px;top:-340px;box-shadow:0 0 0 48px rgba(255,255,255,.025),0 0 0 96px rgba(255,255,255,.02)}.hero:after{content:"";position:absolute;z-index:-1;width:360px;height:360px;border:1px solid rgba(200,164,93,.22);border-radius:50%;left:-250px;bottom:-250px;box-shadow:0 0 0 28px rgba(200,164,93,.035)}.hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(290px,.8fr);gap:clamp(36px,6vw,88px)}.hero-badge{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.2);color:#f1dfb7;padding:9px 15px;letter-spacing:.045em;font-size:11px;text-transform:uppercase}.hero h1{max-width:760px;color:#fff;font-size:clamp(38px,5vw,66px);line-height:1.04;letter-spacing:-.06em;margin:0 0 22px}.hero h1 em{color:#e5c987;font-style:normal}.hero p{max-width:650px;color:rgba(255,255,255,.78);font-size:clamp(14px,1.2vw,16px);line-height:1.9}.hero p strong{color:#fff}.hero-buttons{gap:12px;margin-top:30px}.hero-buttons .btn-primary{background:#d2b16b;color:#183522;border:1px solid #d2b16b}.hero-buttons .btn-primary:hover{background:#e1c889}.hero-buttons .btn-outline{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.35);color:#fff}.hero-buttons .btn-outline:hover{background:rgba(255,255,255,.15)}.hero-stats{border-top:1px solid rgba(255,255,255,.2);margin-top:38px;padding-top:24px;gap:14px}.stat-item strong{color:#f0d99e;font-size:clamp(21px,2.4vw,29px);letter-spacing:-.045em}.stat-item span{color:rgba(255,255,255,.68);font-size:11px;letter-spacing:.02em}.hero-visual{position:relative;background:linear-gradient(150deg,#fff 0%,#f8f7f1 100%);border:1px solid rgba(255,255,255,.55);border-radius:24px;padding:clamp(28px,3.5vw,44px);box-shadow:0 30px 80px rgba(0,0,0,.2);text-align:center}.hero-visual:before{content:"";position:absolute;inset:9px;border:1px solid rgba(200,164,93,.42);border-radius:17px;pointer-events:none}.hero-visual img{width:clamp(118px,13vw,160px);height:clamp(118px,13vw,160px);object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 10px 14px rgba(15,40,24,.12))}.hero-visual h3{color:#183b27;font-size:clamp(17px,1.8vw,22px);line-height:1.35;letter-spacing:-.035em;margin:12px 0 8px}.hero-visual p{color:#718078;font-size:12px;line-height:1.7;margin:0 auto 18px}.unit-pill{background:#eef3eb;border:1px solid #e1e9dd;color:#285437;border-radius:999px;padding:7px 12px;font-size:11px}
section{padding:clamp(58px,7vw,92px) 0}.bg-muted{background:var(--ym-ivory);border-block:1px solid #efeee8}.section-tag{color:#a17d3f;font-size:10px;letter-spacing:.17em;font-weight:800}.section-header h2{font-size:clamp(27px,3.2vw,40px);letter-spacing:-.05em;color:#1b3525}.section-header p{color:#718078;line-height:1.85}.box-card,.unit-card,.feature-item,.news-item,.gallery-card{border:1px solid #e9ebe4;border-radius:18px;background:#fff;box-shadow:0 8px 30px rgba(22,48,30,.045);transition:transform .22s,box-shadow .22s,border-color .22s}.box-card:hover,.unit-card:hover,.feature-item:hover,.news-item:hover,.gallery-card:hover{transform:translateY(-5px);box-shadow:0 20px 44px rgba(22,48,30,.10);border-color:#d6e1d4}.box-card{padding:clamp(22px,3vw,34px)}.unit-card{padding:26px}.unit-badge,.news-tag{background:#edf4ee;color:#205632;border-radius:999px}.unit-counts{color:var(--ym-green)}.feature-item{padding:26px}.feature-icon{border-radius:14px;background:#edf4ee;color:var(--ym-green)}.news-item{padding:23px}.agenda-date{background:#edf4ee;color:#205632;border-radius:12px} .gallery-thumb{border-radius:14px 14px 0 0;overflow:hidden}footer,.site-footer{background:#102f20;color:#e8efe8}footer a,.site-footer a{color:#d9e4da}footer a:hover,.site-footer a:hover{color:#e7cb8d}.footer-bottom{border-top:1px solid rgba(255,255,255,.14)}
/* Shared authenticated application shell */
body:has(.layout-body){background:#f5f6f2;color:#1f2937}.topbar{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);padding:13px clamp(16px,2.8vw,34px);border-bottom:1px solid #e8ebe4;box-shadow:0 4px 18px rgba(20,45,28,.035)}.brand img{width:43px;height:43px;border-radius:12px;border:1px solid #e7e8df;padding:2px}.brand-text h1{font-size:13px;letter-spacing:-.035em;color:#17452b}.brand-text span{font-size:11px}.tenant-badge{background:#f4f6f0;border:1px solid #e5e9df;border-radius:999px;color:#536357}.tenant-select{border:1px solid #dfe5dc;border-radius:9px;padding:8px 11px}.role-pill{background:#edf4ee;border:1px solid #dce8dc;color:#205632;border-radius:999px;padding:7px 12px}.layout-body{max-width:1600px;gap:24px;padding:26px clamp(14px,2.2vw,30px)}.sidebar{width:264px;position:sticky;top:88px;align-self:flex-start;max-height:calc(100vh - 110px);overflow-y:auto;background:linear-gradient(165deg,#123a25 0%,#174b2e 100%);border:0;border-radius:18px;padding:18px 13px;box-shadow:0 18px 42px rgba(15,54,31,.16);scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}.nav-group-title{color:#b8cbb9;font-size:9px;letter-spacing:.16em;padding:18px 12px 8px}.nav-group-title:first-child{padding-top:4px}.nav-link{color:rgba(255,255,255,.76);font-size:12px;font-weight:600;padding:11px 12px;border-radius:10px;margin:2px 0;gap:11px}.nav-link i{color:#b8cbb9;font-size:13px}.nav-link:hover{background:rgba(255,255,255,.10);color:#fff;transform:translateX(3px)}.nav-link:hover i{color:#e5c987}.nav-link.active{background:#e2c47f;color:#173b26;box-shadow:0 7px 18px rgba(0,0,0,.13);font-weight:800}.nav-link.active i{color:#173b26}.main-content{min-width:0}.page-title-bar{margin-bottom:25px;padding-bottom:17px;border-bottom:1px solid #e5e9e1}.page-title-bar h2{font-size:clamp(22px,2vw,29px);letter-spacing:-.05em;color:#183b27}.card,.stat-card{background:#fff;border:1px solid #e8ebe4;border-radius:16px;box-shadow:0 8px 28px rgba(20,45,28,.045)}.card{padding:clamp(17px,2vw,25px);margin-bottom:22px}.card-header{border-bottom:1px solid #edf0e9;padding-bottom:14px}.card-title{color:#23432e;font-size:15px}.grid-stats{gap:15px}.stat-card{padding:19px;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;width:78px;height:78px;border-radius:50%;right:-30px;top:-35px;background:rgba(200,164,93,.09)}.stat-icon{width:45px;height:45px;border-radius:13px;background:#edf4ee;color:#1b6035}.stat-info h4{font-size:23px;letter-spacing:-.05em;color:#1d3c29}.stat-info span{font-size:11px;color:#7a867d}.table-wrap{border:1px solid #edf0e9;border-radius:12px;overflow:auto}table.eco-table,table{font-size:12.5px}table.eco-table th,table th{background:#f4f6f1;color:#526356;font-size:10px;letter-spacing:.09em;padding:14px}table.eco-table td,table td{padding:13px 14px;border-color:#edf0e9}table tbody tr:hover{background:#fafbf8}.btn,.btn-submit,.btn-cetak,.btn-top,.btn-aksi{border-radius:9px;font-weight:700;padding:10px 15px}.btn-primary,.btn-submit{background:#14532d;color:#fff}.btn-primary:hover,.btn-submit:hover{background:#1c6939;box-shadow:0 7px 18px rgba(20,83,45,.18)}.btn-outline,.btn-top{border-color:#dce4da;color:#415448;background:#fff}.btn-danger,.btn-hapus{background:#fff3f1;color:#a92b22;border-color:#f1d5d1}.tabs{gap:8px;border-bottom:1px solid #e7ebe3}.tab-btn{border:1px solid #e3e9df;border-radius:9px;background:#fff;color:#58675c;padding:10px 15px}.tab-btn.active{background:#14532d;border-color:#14532d;color:#fff}.form-group label{color:#43584a;font-size:12px}.form-control,.form-group input,.form-group select,.form-group textarea,input:not([type=checkbox]):not([type=radio]),select,textarea{border:1px solid #dfe6dc;border-radius:9px;background:#fff;color:#25372b;min-height:43px;padding:10px 12px}.form-control:focus,.form-group input:focus,.form-group select:focus,.form-group textarea:focus,input:focus,select:focus,textarea:focus{outline:0;border-color:#568363;box-shadow:0 0 0 3px rgba(20,83,45,.11)}.badge{border-radius:999px;padding:5px 10px}.alert,.alert-box{border-radius:11px}.modal{backdrop-filter:blur(5px);background:rgba(11,31,19,.58)}.modal-box{border:1px solid #e6e9e1;border-radius:17px;box-shadow:0 28px 80px rgba(0,0,0,.22)}.modal-header{background:#f5f7f2;color:#1f3b29}
/* Login and portal screens */
body:has(.login-box){background:radial-gradient(ellipse at 12% 10%,rgba(200,164,93,.20),transparent 27%),radial-gradient(ellipse at 90% 90%,rgba(20,83,45,.13),transparent 30%),linear-gradient(135deg,#f8f7f2,#edf3eb);padding:24px}.login-box{border:1px solid #e5e9df!important;border-radius:22px!important;box-shadow:0 28px 80px rgba(16,59,37,.13)!important;padding:clamp(26px,4vw,42px)!important;max-width:460px!important;position:relative;overflow:hidden}.login-box:before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,#14532d 0%,#c8a45d 100%)}.brand-head img{border:1px solid #e8e9df!important;border-radius:15px!important;padding:4px}.brand-head h2,.login-box h2{color:#17452b!important;letter-spacing:-.045em}.brand-head p,.login-box p{color:#738078;line-height:1.7}.btn-login{background:#14532d!important;border-radius:10px!important;min-height:48px;box-shadow:0 7px 16px rgba(20,83,45,.14)}.btn-login:hover{background:#1b6939!important;transform:translateY(-2px)}
@media(max-width:960px){.layout-body{padding:18px 14px;gap:14px}.sidebar{position:static;width:100%;max-height:none;display:flex;flex-wrap:nowrap;overflow-x:auto;gap:5px;padding:10px}.nav-group-title{display:none}.nav-link{white-space:nowrap;flex:0 0 auto}.topbar{align-items:flex-start}.topbar-right{justify-content:flex-end}.hero-grid{grid-template-columns:1fr  minmax(260px,.75fr)}}
@media(max-width:700px){.navbar{height:72px}.brand img{width:42px;height:42px}.brand-title strong{font-size:12px}.brand-title span{font-size:10px}.nav-menu{top:72px;left:12px;right:12px;border:1px solid #e7ebe4;border-radius:0 0 14px 14px}.hero{padding:52px 0 48px}.hero-grid{grid-template-columns:1fr;gap:28px}.hero h1{font-size:clamp(34px,9vw,46px)}.hero-visual{max-width:440px;width:100%;margin:auto}.hero-stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:18px}.hero-buttons .btn{flex:1 1 100%}.layout-body{padding:12px}.topbar{padding:11px 13px}.topbar-right{width:100%;justify-content:flex-start;gap:7px}.role-pill{max-width:100%;overflow:hidden;text-overflow:ellipsis}.grid-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.stat-card{padding:13px;gap:9px}.stat-icon{width:36px;height:36px}.stat-info h4{font-size:18px}.card{padding:15px;border-radius:13px}.page-title-bar h2{font-size:21px}.form-grid,.form-grid-2,.form-grid-3{grid-template-columns:minmax(0,1fr)}.table-wrap{max-width:100%;overflow-x:auto}table{min-width:620px}.login-box{padding:28px 21px!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Responsive Mobile & Minimalist Enhancements v3.0 */
.table-wrap{-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.notif-item{transition:background .15s,border-color .15s}
@media(max-width:700px){
  .page-title-bar{flex-direction:column;align-items:flex-start;gap:10px}
  .page-title-bar > div:last-child{width:100%;display:flex;gap:8px}
  .page-title-bar > div:last-child .btn{flex:1;justify-content:center}
  .tabs{padding-bottom:8px;gap:6px}
  .tab-btn{padding:8px 12px;font-size:12px}
  table.eco-table th,table th,table.eco-table td,table td{padding:10px 11px;font-size:12px}
}