
/* CenterHub mobile real-card rendering v3: الطلاب + الغياب والحضور */
@media (max-width: 760px){
  html, body{overflow-x:hidden!important;max-width:100%!important;}
  .main-content,.container,.tab-content,#tab-students,#tab-attendance{max-width:100%!important;min-width:0!important;overflow-x:hidden!important;box-sizing:border-box!important;}
  #tab-students .card,#tab-attendance .card{max-width:100%!important;min-width:0!important;overflow:hidden!important;}

  #stListArea.cdx-mobile-cards-ready,
  #attTableArea.cdx-mobile-cards-ready{
    overflow:visible!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;
  }
  #stListArea.cdx-mobile-cards-ready > table,
  #attTableArea.cdx-mobile-cards-ready > table{display:none!important;}
  .cdx-card-list-v3{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;}
  .cdx-mobile-card-v3{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;border:1px solid #dbe4ff!important;border-radius:20px!important;background:linear-gradient(180deg,#fff,#fbfdff)!important;box-shadow:0 10px 25px rgba(15,23,42,.07)!important;padding:13px!important;overflow:hidden!important;}
  .cdx-mobile-card-head-v3{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important;padding-bottom:10px!important;margin-bottom:8px!important;border-bottom:1px solid #edf2ff!important;}
  .cdx-mobile-title-v3{font-weight:900!important;color:#0f172a!important;font-size:16px!important;line-height:1.65!important;word-break:normal!important;overflow-wrap:break-word!important;min-width:0!important;}
  .cdx-mobile-sub-v3{font-size:12px!important;color:#64748b!important;font-weight:800!important;line-height:1.5!important;margin-top:2px!important;}
  .cdx-mobile-code-v3{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:max-content!important;max-width:100%!important;padding:6px 10px!important;border-radius:999px!important;background:#f1f5f9!important;color:#334155!important;font-family:monospace!important;font-weight:900!important;font-size:13px!important;white-space:nowrap!important;}
  .cdx-mobile-row-v3{display:grid!important;grid-template-columns:95px minmax(0,1fr)!important;gap:9px!important;align-items:center!important;padding:8px 0!important;border-bottom:1px solid #f1f5f9!important;min-width:0!important;}
  .cdx-mobile-row-v3:last-child{border-bottom:0!important;}
  .cdx-mobile-label-v3{color:#243b84!important;font-weight:900!important;font-size:13px!important;line-height:1.45!important;}
  .cdx-mobile-value-v3{color:#0f172a!important;font-weight:800!important;font-size:14px!important;line-height:1.6!important;min-width:0!important;word-break:normal!important;overflow-wrap:break-word!important;}
  .cdx-mobile-phone-v3{direction:ltr!important;text-align:right!important;unicode-bidi:plaintext!important;font-family:Arial,Tahoma,sans-serif!important;}
  .cdx-mobile-actions-v3{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:12px!important;}
  .cdx-mobile-actions-v3 button{width:100%!important;min-width:0!important;min-height:40px!important;border-radius:13px!important;padding:8px 7px!important;font-size:12.5px!important;line-height:1.35!important;white-space:normal!important;}
  .cdx-mobile-select-v3{display:flex!important;align-items:center!important;gap:8px!important;font-size:13px!important;font-weight:900!important;color:#334155!important;}
  .cdx-mobile-select-v3 input{width:20px!important;height:20px!important;min-height:20px!important;accent-color:#6366f1!important;}
  .cdx-mobile-empty-v3{text-align:center!important;padding:28px 14px!important;border:1px dashed #cbd5e1!important;border-radius:20px!important;background:#f8fbff!important;color:#64748b!important;font-weight:900!important;line-height:1.8!important;word-break:normal!important;overflow-wrap:normal!important;}
  .cdx-mobile-empty-v3 i{display:block!important;font-size:28px!important;margin-bottom:8px!important;color:#6366f1!important;}
  .cdx-mobile-empty-v3 b{display:block!important;font-size:15px!important;color:#334155!important;}
  .cdx-mobile-empty-v3 span{display:block!important;font-size:12.5px!important;color:#64748b!important;margin-top:4px!important;}

  .cdx-att-mobile-status-v3{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:max-content!important;max-width:100%!important;min-width:74px!important;padding:7px 12px!important;border-radius:999px!important;font-size:13px!important;font-weight:900!important;}
  .cdx-att-mobile-status-v3.present{background:#dcfce7!important;color:#166534!important;}
  .cdx-att-mobile-status-v3.absent{background:#fee2e2!important;color:#991b1b!important;}
  .cdx-att-mobile-status-v3.late{background:#fef3c7!important;color:#92400e!important;}
  .cdx-att-mobile-status-v3.excused{background:#e0f2fe!important;color:#075985!important;}
  .cdx-att-state-grid-v3{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:12px!important;}
  .cdx-att-state-grid-v3 button{width:100%!important;min-height:41px!important;border-radius:13px!important;border:1px solid #dbe4ff!important;background:#fff!important;color:#172554!important;font-weight:900!important;font-size:12.5px!important;padding:8px 6px!important;}
  .cdx-att-state-grid-v3 button.active{background:linear-gradient(135deg,#6366f1,#7c3aed)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 18px rgba(99,102,241,.18)!important;}
  .cdx-att-whatsapp-v3{grid-column:1 / -1!important;background:#22c55e!important;color:#fff!important;border-color:#22c55e!important;}
  #tab-attendance #attActions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;}
  #tab-attendance #attActions.hidden{display:none!important;}
  #tab-attendance #attActions button{width:100%!important;min-height:44px!important;font-size:12.5px!important;}

  #tab-students .students-excel-table td,
  #tab-attendance #attTableArea td{word-break:normal!important;overflow-wrap:break-word!important;}
  #tab-students .card:has(button[onclick="exportStudentsToExcel()"]),
  #tab-students .card:has(button[onclick="importFromExcel()"]){overflow:hidden!important;}
}
@media (max-width: 390px){
  .cdx-mobile-row-v3{grid-template-columns:82px minmax(0,1fr)!important;gap:8px!important;}
  .cdx-mobile-title-v3{font-size:15px!important;}
  .cdx-mobile-value-v3{font-size:13px!important;}
}
