/* Hamza Portal 2.16.5 — cohesive Quranic UI, style-only.
   Preserves form handlers, status semantics, grades and database interactions. */
:root {
  --hhp-olive:#4f5639;
  --hhp-olive2:#5d6544;
  --hhp-gold:#b28a45;
  --hhp-gold-dark:#865f26;
  --hhp-bg:#f9f7f2;
  --hhp-card:#fffefb;
  --hhp-text:#23251c;
  --hhp-muted:#77786b;
  --hhp-green:#1f855c;
  --hhp-red:#b84544;
  --hhp-orange:#b67a29;
  --hhp-line:#e6e0d3;
  --hhp-cream:#f3eee4;
  --hhp-cream-2:#fbf9f4;
  --hhp-charcoal:#4f5639;
  --hhp-charcoal-2:#5d6544;
}
body.hhp-standalone-body {
  background:radial-gradient(ellipse at 12% 5%,rgba(189,159,92,.08),transparent 35%),#f7f8f3!important;
}
.hhp-app,.hhp-login-shell,.hhp-history-page,.hhp-curriculum-page,.hhp-teacher-modern,.hhp-admin-wrap {
  font-family:Tajawal,"Noto Sans Arabic",Tahoma,Arial,sans-serif!important;
  -webkit-font-smoothing:antialiased;
  color:var(--hhp-text);
}
.hhp-app {
  border:1px solid #e6e9df;
  background:linear-gradient(180deg,#fffefa,#fafbf8 65%,#f6f7f2);
  border-radius:24px;
  box-shadow:0 24px 60px rgba(66,71,51,.07);
}
/* Universal portal masthead */
.hhp-app .hhp-hero {
  background:radial-gradient(circle at 11% 18%,rgba(218,187,113,.13),transparent 34%),
    linear-gradient(120deg,#353926,#4a5037 60%,#585f42)!important;
  border-radius:0 0 30px 30px;
  padding:26px clamp(20px,3vw,37px) 35px;
  border-bottom:3px solid #b38e4d;
}
.hhp-app .hhp-pattern {opacity:.065!important;background-size:75px 110px}
.hhp-app .hhp-hero h1 {font-weight:800;font-size:clamp(23px,2.4vw,33px);line-height:1.4}
.hhp-app .hhp-hero p {font-size:13px;line-height:1.7;color:#ebede6;opacity:1}
.hhp-app .hhp-brand-logo{width:56px;height:56px;flex-basis:56px;border-radius:16px;background:#fffefa;border:1px solid #d2b77d;padding:4px}
.hhp-app .hhp-user-chip{border:1px solid rgba(232,210,163,.22);background:rgba(255,255,255,.09);border-radius:100px;padding:10px 15px;color:#f7f9ef}
.hhp-app .hhp-logout{border:1px solid rgba(255,255,255,.24);border-radius:11px;background:rgba(255,255,255,.09);padding:10px 15px;font-weight:700}
.hhp-app .hhp-logout:hover{background:rgba(255,255,255,.18)}
.hhp-app .hhp-main{padding:clamp(18px,3vw,35px)}
/* Large text rhythm and balanced whitespaces */
.hhp-app :is(.hhp-section-title h2,.hhp-teacher-welcome h2,.hhp-teacher-progress-intro h2,.hhp-history-heading h2),
.hhp-curriculum-page :is(h1,h2) {
  color:#414631;
  font-weight:800;
  letter-spacing:0;
  line-height:1.45;
}
.hhp-app .hhp-section-title{margin:18px 0 17px;gap:14px}
.hhp-app .hhp-section-title h2{font-size:clamp(20px,2.1vw,26px)}
.hhp-app .hhp-section-title h2:before{content:"";display:inline-block;width:5px;height:21px;background:#c39a52;border-radius:4px;margin-inline-end:9px;vertical-align:-4px}
.hhp-app :is(.hhp-teacher-welcome,.hhp-teacher-progress-intro,.hhp-admin-front-welcome,.hhp-history-heading){
  background:linear-gradient(135deg,#f1f3ec 0%,#fffaf0 100%);
  border:1px solid #dce7db;
  border-radius:20px;
  box-shadow:none;
  padding:clamp(18px,2.8vw,29px);
}
.hhp-app :is(.hhp-student-card,.hhp-teacher-actions>a,.hhp-admin-front-card,.hhp-student-task,.hhp-supervisor-attendance-card,.hhp-history-record,.hhp-history-directory,.hhp-curriculum-student-card,.hhp-front-metrics>div,.hhp-stat-row>div,.hhp-admin-shortcuts>a,.hhp-login-cardbox,.hhp-smart-dashboard){
  background:#fffefa;border:1px solid #e2e8dd;border-radius:19px;
  box-shadow:0 7px 25px rgba(60,65,44,.045);
}
.hhp-app :is(.hhp-student-card,.hhp-curriculum-student-card,.hhp-teacher-actions>a){transition:border-color .2s,box-shadow .2s}
.hhp-app :is(.hhp-student-card,.hhp-curriculum-student-card,.hhp-teacher-actions>a):hover{border-color:#d6c299;box-shadow:0 12px 30px rgba(60,65,44,.095)}
/* Student list: generous type, accessible buttons and no cropped arrow */
.hhp-app .hhp-student-card{margin:0 0 12px;overflow:visible}
.hhp-app .hhp-student-summary{padding:18px 20px;min-width:0;grid-template-columns:minmax(0,1fr) auto;gap:13px}
.hhp-app .hhp-student-summary h3{font-size:clamp(16px,1.45vw,19px);font-weight:800;line-height:1.5;margin:0 0 5px}
.hhp-app .hhp-student-summary p{font-size:12px;line-height:1.7}
.hhp-app .hhp-student-summary>b{width:43px;height:43px;border-radius:13px;background:#f2f4ed;color:#4b5136;font-size:24px;border:1px solid #e3e6da}
.hhp-app .hhp-student-card.open .hhp-student-summary>b{background:#444934;color:white}
.hhp-app .hhp-student-body{border-top:1px solid #e8ebe1;padding:clamp(14px,2.5vw,26px)}
.hhp-app .hhp-student-card-actions{padding-inline:0;gap:9px;flex-wrap:wrap;min-width:0}
.hhp-app .hhp-student-open-arrow{min-width:44px!important;width:44px!important;min-height:44px!important;height:44px!important;flex:0 0 44px!important;background:#f7f2e8!important;border:1px solid #e3d6bd!important;border-radius:12px!important;color:#8d6b2f!important;display:grid!important;place-items:center!important;position:relative!important;inset:auto!important;transform:none;box-shadow:none!important}
.hhp-app .hhp-student-open-arrow:hover{background:#efe4cc!important}
.hhp-app .hhp-student-history-link{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:9px 16px;white-space:normal;text-align:center}
/* Stats / at-a-glance */
.hhp-app .hhp-stat-row{gap:11px}
.hhp-app .hhp-stat-row>div{padding:17px 10px;min-height:94px}
.hhp-app .hhp-stat-row strong{font-size:clamp(21px,2.2vw,32px);color:#474c35;font-weight:800}
.hhp-app .hhp-stat-row span{font-size:12px;color:#999c90}
.hhp-app .hhp-front-metrics{gap:13px}
.hhp-app .hhp-front-metrics>div{min-height:132px;padding:20px}
.hhp-app .hhp-front-metrics strong{color:#474c35;font-size:34px;margin:13px 0 4px}
.hhp-app .hhp-admin-shortcuts>a{padding:22px 20px;gap:9px;min-height:95px}
.hhp-app .hhp-admin-shortcuts b{font-size:16px;color:#474c36}
.hhp-app .hhp-admin-shortcuts span{font-size:12px}
/* Menus, tabs and searchable directories */
.hhp-app .hhp-tabs{gap:10px;padding-bottom:8px}
.hhp-app .hhp-tabs a,.hhp-app .hhp-card-tabs button{background:#fff;border:1px solid #e1e8de;border-radius:12px;color:#727762!important;min-height:44px;font-size:13px;font-weight:700;padding:11px 16px}
.hhp-app .hhp-tabs a.active,.hhp-app .hhp-card-tabs button.active{background:#474d33!important;border-color:#474d33!important;color:#fff!important;box-shadow:0 5px 13px rgba(66,72,47,.13)}
.hhp-app .hhp-search-wrap input{border:1px solid #dee1d5;background:#fffefa;border-radius:14px;min-height:52px;padding-inline:45px 15px;font-size:14px;box-shadow:0 3px 12px rgba(56,61,39,.025)}
.hhp-app .hhp-search-wrap input:focus{border-color:#b38e4d;box-shadow:0 0 0 4px rgba(184,146,71,.12)}
.hhp-app .hhp-card-tabs{gap:10px;margin:0 0 17px}
.hhp-app .hhp-card-tabs button{border-radius:13px}
/* Forms and read-only curriculum cards */
.hhp-app :is(input:not([type=checkbox]):not([type=radio]),select,textarea),
.hhp-curriculum-page :is(input:not([type=checkbox]):not([type=radio]),select,textarea){
  border:1px solid #e0e3d8!important;border-radius:13px!important;background:#fff!important;color:#393b30;box-shadow:none;
  min-height:42px;
}
.hhp-app :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus-visible,
.hhp-curriculum-page :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus-visible{
  outline:3px solid rgba(188,145,66,.22)!important;outline-offset:2px;border-color:#b28a45!important;
}
.hhp-app .hhp-progress-form label{font-size:12px;font-weight:700;color:#838677;line-height:1.7}
.hhp-app :is(.hhp-last-progress,.hhp-next-box,.hhp-curriculum-readonly-range,.hhp-student-learning-track,.hhp-history-filters){
  background:#f4f7f1;border:1px solid #e1e9df;border-radius:16px;padding:clamp(12px,2vw,19px);
}
.hhp-app .hhp-curriculum-readonly-range{border-right:3px solid #b8904a}
.hhp-app :is(.hhp-btn.primary,.hhp-btn.gold,.hhp-login-submit,.hhp-supervisor-attendance-save,.hhp-history-filters button){
  background:#464c32!important;color:white!important;border:1px solid #464c32!important;border-radius:13px!important;
  box-shadow:0 8px 16px rgba(70,76,51,.13);font-weight:800;min-height:43px;
}
.hhp-app :is(.hhp-btn.primary,.hhp-btn.gold,.hhp-login-submit,.hhp-history-filters button):hover{background:#626a49!important;transform:translateY(-1px)}
.hhp-app :is(.hhp-student-history-link,.hhp-curriculum-history-link,.hhp-history-student-head a,.hhp-home-btn){
  color:#7f5d24!important;background:#fffaf0!important;border:1px solid #e8d7b2!important;
  border-radius:13px;box-shadow:none;
}
.hhp-app .hhp-announcements>div,.hhp-app .hhp-history-notes{border-right:3px solid #c09a50;background:#fff9ed;border-radius:13px}
.hhp-app .hhp-empty{background:#f8fbf8;border:1px dashed #dcdfd2;border-radius:16px;color:#8f9385}
.hhp-app :is(.hhp-current-memorization,.hhp-curriculum-progress-track){accent-color:#5e6742}
.hhp-app .hhp-curriculum-student-card{padding:clamp(16px,2.5vw,26px)}
/* Bottom nav more breathable on phones; do not change its navigation logic. */
.hhp-app .hhp-bottom-nav{background:rgba(48,52,35,.97)!important;border:1px solid rgba(218,189,118,.2)!important;border-radius:17px 17px 0 0;box-shadow:0 9px 30px rgba(43,47,33,.19);padding-block:12px calc(10px + env(safe-area-inset-bottom));width:min(1100px,calc(100% - 24px))}
.hhp-app .hhp-bottom-nav a{font-size:11px;color:#d8dccd!important;gap:5px;min-height:39px}
.hhp-app .hhp-bottom-nav a span{font-size:21px}
.hhp-app .hhp-bottom-nav a.active{color:#eacb89!important;font-weight:800}
/* Login experience with restrained ornamental motif and accessible text. */
body.hhp-login-page{background:linear-gradient(125deg,#343826,#535a3e)!important}
.hhp-login-shell{background:radial-gradient(circle at 17% 13%,rgba(218,186,109,.13),transparent 32%),transparent!important}
.hhp-login-shell .hhp-login-cardbox{max-width:465px;background:#fffefa;border:1px solid #e4ddca;border-radius:27px;padding:clamp(22px,3.5vw,37px);box-shadow:0 25px 67px rgba(42,45,31,.25)}
.hhp-login-shell .hhp-login-heading h1{font-size:clamp(26px,3vw,35px);color:#474d35}
.hhp-login-shell .hhp-login-submit{min-height:48px!important;background:#494e35!important}
/* WordPress supervisor plugin surfaces */
.hhp-admin-wrap{color:#393b30;font-family:Tajawal,"Noto Sans Arabic",Tahoma,Arial,sans-serif!important}
.hhp-admin-wrap :is(.hhp-admin-welcome,.hhp-admin-topbar,.hhp-metric,.hhp-admin-card,.hhp-supervisor-list){border-radius:20px;box-shadow:0 8px 30px rgba(59,64,43,.055)}
.hhp-admin-wrap .hhp-admin-welcome{background:linear-gradient(125deg,#363a28,#595f43)!important}
.hhp-admin-wrap :is(.hhp-metric strong,.hhp-page-title h1,.hhp-admin-brand h1){color:#454a33}
.hhp-admin-wrap :is(.hhp-gold-button,.button-primary,.hhp-admin-homebtn){background:#474d33!important;border-color:#474d33!important;color:#fff!important;border-radius:12px!important}
.hhp-admin-wrap .hhp-responsive-table th{background:#f0f2eb;color:#545944}
/* Extra components, dialogs, responsive tables */
.hhp-alert-dialog,.hhp-smart-dashboard{border-radius:22px;background:#fffefa;box-shadow:0 25px 66px rgba(49,54,35,.17)}
.hhp-alert-dialog-header{background:linear-gradient(105deg,#eaf3e9,#fff9ef)!important}
.hhp-alert-dialog-header h2,.hhp-smart-header h2{color:#494e37!important;font-weight:800}
.hhp-alert-entry,.hhp-smart-entry{border-right:3px solid #bd9350;background:#fffefa;border-radius:12px}
.hhp-alert-filters button.is-active,.hhp-alert-footer button{background:#494e35!important;border-color:#494e35!important}
.hhp-history-page,.hhp-curriculum-page{background:#fffefa;border:1px solid #e4e9e0;border-radius:20px;box-shadow:0 14px 38px rgba(55,60,40,.06)}
.hhp-history-page :is(h1,h2),.hhp-curriculum-page :is(h1,h2){color:#454b33}
.hhp-history-page :is(.hhp-history-record,.hhp-history-records,.hhp-history-student-head){background:#fffefa;border-color:#e1e8dc;border-radius:16px}
@media(max-width:800px){
 .hhp-app{border:0;border-radius:0;box-shadow:none}
 .hhp-app .hhp-main{padding:17px 14px 96px}
 .hhp-app .hhp-hero{border-radius:0 0 23px 23px;padding:20px 15px 31px}
 .hhp-app .hhp-student-summary{padding:14px}
 .hhp-app .hhp-student-summary h3{font-size:16px}
 .hhp-app :is(.hhp-teacher-welcome,.hhp-teacher-progress-intro,.hhp-admin-front-welcome){padding:17px}
 .hhp-app .hhp-front-metrics>div{min-height:100px;padding:14px}
 .hhp-app .hhp-admin-shortcuts>a{padding:14px}
 .hhp-curriculum-page,.hhp-history-page{border:0;border-radius:0;box-shadow:none}
}
@media(max-width:430px){
 .hhp-app .hhp-main{padding:14px 11px 98px}
 .hhp-app .hhp-brand-logo{width:45px;height:45px;flex-basis:45px}
 .hhp-app .hhp-hero h1{font-size:20px}
 .hhp-app .hhp-student-card-actions{width:100%;justify-content:flex-start;gap:7px}
 .hhp-app .hhp-student-open-arrow{min-width:44px!important}
 .hhp-app .hhp-student-history-link{font-size:12px;padding-inline:10px}
 .hhp-app .hhp-bottom-nav{width:calc(100% - 16px);border-radius:15px 15px 0 0}
 .hhp-app .hhp-stat-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){.hhp-app *, .hhp-app *::before,.hhp-app *::after{transition-duration:0s!important}}

/* v2.16.5 — desktop portal canvas. The old 780px mobile-first cap must not
   constrain the management portal on wide screens. Pure presentation change. */
@media (min-width: 1000px) {
  body.hhp-standalone-body .hhp-standalone-frame {
    width:100%;
    max-width:none;
    box-sizing:border-box;
    padding:22px 20px 46px;
  }
  body.hhp-standalone-body .hhp-app.hhp-role-admin,
  body.hhp-standalone-body .hhp-app.hhp-role-supervisor {
    width:calc(100% - 20px)!important;
    max-width:1480px!important;
    min-width:0;
    margin-inline:auto!important;
  }
  body.hhp-standalone-body .hhp-app.hhp-role-teacher {
    width:calc(100% - 20px)!important;
    max-width:1240px!important;
    min-width:0;
    margin-inline:auto!important;
  }
  body.hhp-standalone-body .hhp-app.hhp-role-student {
    width:calc(100% - 20px)!important;
    max-width:980px!important;
    min-width:0;
    margin-inline:auto!important;
  }
  body.hhp-standalone-body .hhp-app.hhp-role-admin .hhp-bottom-nav,
  body.hhp-standalone-body .hhp-app.hhp-role-supervisor .hhp-bottom-nav {
    width:min(1450px,calc(100% - 84px))!important;
    max-width:1450px;
  }
  body.hhp-standalone-body .hhp-app.hhp-role-teacher .hhp-bottom-nav {
    width:min(1240px,calc(100% - 60px))!important;
    max-width:1240px;
  }
  body.hhp-standalone-body .hhp-app .hhp-main {
    padding-inline:clamp(24px,3vw,48px);
  }
  body.hhp-standalone-body .hhp-app .hhp-front-metrics {
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  body.hhp-standalone-body .hhp-app .hhp-front-metrics>div {
    min-width:0;
    min-height:125px;
    padding:20px 22px;
  }
  body.hhp-standalone-body .hhp-app .hhp-front-metrics>div span {
    font-size:14px;
  }
  body.hhp-standalone-body .hhp-app .hhp-front-metrics>div strong {
    font-size:clamp(29px,2.4vw,38px);
  }
  body.hhp-standalone-body .hhp-app .hhp-front-metrics>div small {
    font-size:12px;
  }
}
@media (max-width:999px) {
  body.hhp-standalone-body .hhp-app {
    width:100%!important;
    min-width:0;
  }
}
/* v2.18.0 — رقم التواصل في صفحة الدخول */
.hhp-login-help .hhp-login-contact{justify-self:center;display:inline-flex;gap:6px;align-items:center;margin-top:6px;font-size:12px;font-weight:700;color:var(--hhp-olive)!important;text-decoration:none!important;background:var(--hhp-cream);border-radius:99px;padding:5px 12px}

/* v2.18.2 — تقسيم إحصائيات اللوحة */
.hhp-front-totals{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.hhp-dash{display:grid;gap:18px;margin:18px 0}
.hhp-dash-filter{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--hhp-card);border:1px solid var(--hhp-line);border-radius:16px;padding:10px 14px}
.hhp-dash-filter label{font-weight:700;font-size:13px;color:var(--hhp-text)}
.hhp-dash-filter select{flex:1;min-width:180px;min-height:40px;border:1px solid var(--hhp-line);border-radius:10px;padding:6px 10px;background:#fff;font:inherit}
.hhp-dash-block{background:var(--hhp-card);border:1px solid var(--hhp-line);border-radius:20px;padding:18px}
.hhp-dash-title{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.hhp-dash-title span{font-size:12px;color:var(--hhp-gold-dark);font-weight:700}
.hhp-dash-title h2{margin:2px 0 0;font-size:20px;color:var(--hhp-text)}
.hhp-dash-title small{color:var(--hhp-muted);font-size:12px}
.hhp-dash-hint{margin:0 0 12px;padding:9px 12px;border-radius:10px;background:var(--hhp-cream);color:var(--hhp-muted);font-size:12.5px}
.hhp-dash-today{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;grid-auto-flow:dense}
.hhp-dash-card{border:1px solid var(--hhp-line);border-radius:16px;background:#fff;overflow:hidden;align-self:start}
.hhp-dash-card summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr auto;grid-template-areas:"label num" "unit num";gap:2px 8px;padding:14px 16px;border-inline-start:4px solid var(--tone,#c9bd9d)}
.hhp-dash-card summary::-webkit-details-marker{display:none}
.hhp-dash-label{grid-area:label;font-size:13px;font-weight:700;color:var(--hhp-text)}
.hhp-dash-card summary strong{grid-area:num;font-size:30px;line-height:1;color:var(--hhp-text);align-self:center}
.hhp-dash-card summary small{grid-area:unit;font-size:11.5px;color:var(--hhp-muted)}
.hhp-dash-card.is-zero summary strong{color:#a7a89c}
.hhp-dash-card.tone-bad{--tone:#b84544}.hhp-dash-card.tone-warn{--tone:#c08a2e}.hhp-dash-card.tone-info{--tone:var(--hhp-olive)}.hhp-dash-card.tone-muted{--tone:#9a9c8f}
.hhp-dash-card[open]{grid-column:1/-1}
.hhp-dash-card[open] summary{background:var(--hhp-cream)}
.hhp-dash-body{padding:6px 12px 12px}
.hhp-dash-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px}
.hhp-dash-list li{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--hhp-line);border-radius:10px;background:var(--hhp-cream-2)}
.hhp-dash-list li>span{display:grid;flex:1;min-width:0}
.hhp-dash-list strong{font-size:13.5px;color:var(--hhp-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hhp-dash-list small{font-size:11px;color:var(--hhp-muted)}
.hhp-dash-list em{font-style:normal;font-size:11px;color:var(--hhp-gold-dark);white-space:nowrap}
.hhp-dash-wa{flex:none;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:99px;background:#e6f3ea;color:#1f6b45!important;text-decoration:none!important}
.hhp-dash-more{justify-content:center;color:var(--hhp-muted);font-size:12px}
.hhp-dash-empty{margin:6px 2px;color:var(--hhp-muted);font-size:13px}
.hhp-dash-link{display:inline-block;margin-top:10px;font-weight:700;font-size:13px;color:var(--hhp-olive)!important}
.hhp-dash-periods{display:flex;gap:4px;background:var(--hhp-cream);border-radius:12px;padding:4px}
.hhp-dash-periods a{padding:6px 14px;border-radius:9px;font-size:13px;font-weight:700;color:var(--hhp-muted)!important;text-decoration:none!important}
.hhp-dash-periods a.active{background:var(--hhp-olive);color:#fff!important}
.hhp-dash-range{margin:-4px 0 10px;font-size:12px;color:var(--hhp-muted)}
.hhp-dash-perf{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.hhp-dash-perf div{display:grid;gap:3px;padding:14px;border:1px solid var(--hhp-line);border-radius:14px;background:#fff}
.hhp-dash-perf span{font-size:12px;color:var(--hhp-muted);font-weight:600}
.hhp-dash-perf strong{font-size:26px;color:var(--hhp-olive)}
.hhp-dash-perf small{font-size:11px;color:var(--hhp-muted)}
@media(max-width:700px){
 .hhp-dash-today{grid-template-columns:repeat(2,minmax(0,1fr))}
 .hhp-dash-perf{grid-template-columns:repeat(2,minmax(0,1fr))}
 .hhp-dash-perf div:last-child{grid-column:1/-1}
 .hhp-dash-card summary strong{font-size:26px}
 .hhp-dash-list{grid-template-columns:1fr}
}
/* v2.18.2 — أزرار واتساب في بطاقة الطالب */
.hhp-wa-actions{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.hhp-wa-actions .hhp-guardian-whatsapp{margin:0!important}
.hhp-wa-actions .hhp-guardian-whatsapp.is-result{background:#1f6b45!important;color:#fff!important;border-color:#1f6b45!important}

/* v2.18.8 — تم الإرسال، الإخوة، الإرسال بالترتيب */
.hhp-wa-list{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.hhp-wa-list li{display:grid;grid-template-columns:1fr auto;align-items:center;gap:5px 10px}
.hhp-wa-list li>span{grid-column:1/-1;display:block}
.hhp-wa-list li>span strong{display:block;white-space:normal;line-height:1.5}
.hhp-wa-list li>span small{display:block;line-height:1.6}
.hhp-wa-list li>em{grid-column:1;justify-self:start}
.hhp-wa-list li>.hhp-dash-wa{grid-column:2;grid-row:2}
.hhp-wa-list li:not(:has(em))>.hhp-dash-wa{grid-column:1/-1;justify-self:end}
.hhp-wa-unit.is-sent{background:#f6faf6}
.hhp-wa-unit.is-sent .hhp-dash-wa{background:#fff;border:1px solid #cfe5d6;color:#6b7c70!important}
.hhp-wa-sent{font-style:normal;font-size:11px!important;color:#2f7a45!important;font-weight:700;white-space:nowrap}
.hhp-wa-missing{font-style:normal;font-size:11px;color:#a49a8c;white-space:nowrap}
.hhp-wa-siblings{display:inline-block;font-size:10.5px;font-weight:800;color:#8a5a14;background:#fbf1dc;border-radius:99px;padding:1px 7px;margin-inline-end:4px}
.hhp-wa-count{display:block;font-style:normal;font-size:11px;font-weight:700;color:#a14b3f;margin-top:3px}
.hhp-wa-count.is-done{color:#2f7a45}
.hhp-wa-seq{margin:0 0 8px}
.hhp-wa-seq-start{appearance:none;border:0;border-radius:10px;background:#1f7a4d;color:#fff;font:inherit;font-size:12.5px;font-weight:800;padding:8px 13px;cursor:pointer}
.hhp-wa-seq-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;background:#eef7f0;border:1px solid #cfe5d6;border-radius:12px;padding:9px 11px;font-size:12.5px}
.hhp-wa-seq-bar strong{color:#1f5b3a}
.hhp-wa-seq-bar b{font-weight:700;color:#5b6a5f}
.hhp-wa-seq-bar div{display:flex;gap:6px}
.hhp-wa-seq-bar button{appearance:none;border:1px solid #cfe5d6;border-radius:9px;background:#fff;font:inherit;font-size:12px;font-weight:700;padding:6px 11px;cursor:pointer;color:#3c3e33}
.hhp-wa-seq-bar .hhp-wa-seq-send{background:#1f7a4d;border-color:#1f7a4d;color:#fff}
.hhp-wa-seq-done{margin:0;font-size:12.5px;font-weight:800;color:#2f7a45}
.hhp-group-att-actions .hhp-wa-sent,.hhp-group-att-actions .hhp-wa-siblings{justify-self:center;text-align:center}

/* v2.18.13 — التقويم: إجازة / عن بعد */
.hhp-cal-banner{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:13px 16px;border-radius:16px;border:1px solid #e3d6b8;background:#fbf6ea}
.hhp-cal-banner b{font-size:24px;line-height:1}
.hhp-cal-banner span{display:grid;gap:2px}
.hhp-cal-banner strong{font-size:15px;color:#4a4f37}
.hhp-cal-banner small{font-size:12.5px;color:#7a7a6a}
.hhp-cal-banner.is-remote{background:#eef4fb;border-color:#c9d9ee}
.hhp-cal-banner.is-remote strong{color:#2f5b8a}
.hhp-cal-banner.is-soon{opacity:.92;border-style:dashed}
.hhp-cal-holiday-card{display:grid;justify-items:center;gap:6px;text-align:center;padding:34px 18px;border-radius:20px;border:1px solid #e3d6b8;background:#fffaf0;margin:10px 0}
.hhp-cal-holiday-card b{font-size:44px;line-height:1}
.hhp-cal-holiday-card h2{margin:0!important;font-size:24px!important;color:#4a4f37}
.hhp-cal-holiday-card p{margin:0;color:#5d6150}
.hhp-cal-holiday-card small{color:#8a8d7e}
.hhp-dash-cal{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.hhp-dash-cal span{padding:6px 12px;border-radius:99px;font-size:12.5px;font-weight:700;background:#fbf1dc;color:#7a5a1a}
.hhp-dash-cal span.is-remote{background:#e8f0fa;color:#2f5b8a}
