/* ═══════════════════════════════════════════════════
   CSACEFA Membership Portal — v2 Professional Theme
   Brand: Deep Teal #005552 · Gold #C8922A
═══════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --cs-p:#005552;--cs-pd:#003B39;--cs-pm:#007A6E;
  --cs-pl:#E6F4F3;--cs-pxl:#F0FAF9;
  --cs-gold:#C8922A;--cs-gl:#FEF6E8;--cs-gd:#A0711A;
  --cs-white:#fff;--cs-bg:#F5FAF9;
  --cs-bdr:#C8DFDD;--cs-bdrm:#9FBFBC;
  --cs-text:#1A2B2A;--cs-mut:#5A7876;
  --cs-err:#C0392B;--cs-erl:#FEF0EE;
  --cs-ok:#1A7A55;--cs-okl:#EAF6F0;
  --cs-warn:#B45309;--cs-wl:#FFFBEB;
  --r:14px;--rs:9px;--rx:20px;
  --sh:0 2px 16px rgba(0,85,82,.09);
  --shl:0 8px 40px rgba(0,85,82,.14);
  --ff:'Plus Jakarta Sans',system-ui,sans-serif;
  --ffd:'Cormorant Garamond',Georgia,serif;
  --ffm:'JetBrains Mono',monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

.csacefa-wrap{font-family:var(--ff);color:var(--cs-text);max-width:860px;margin:2rem auto;padding:0 1rem}
.csacefa-wrap-narrow{max-width:520px}
.csacefa-wrap-wide{max-width:1100px}

.csacefa-card{background:var(--cs-white);border:1px solid var(--cs-bdr);border-radius:var(--r);padding:2rem;box-shadow:var(--sh)}
.csacefa-card-header{display:flex;align-items:center;gap:14px;padding-bottom:1.25rem;margin-bottom:1.5rem;border-bottom:1px solid var(--cs-bdr)}
.csacefa-logo-mark{width:52px;height:52px;border-radius:50%;background:var(--cs-pl);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--cs-p)}
.csacefa-logo-mark img{width:40px;height:40px;border-radius:50%;object-fit:contain}
.csacefa-logo-mark svg{width:28px;height:28px}
.csacefa-card-title{font-family:var(--ffd);font-size:1.4rem;font-weight:600;color:var(--cs-text);line-height:1.2}
.csacefa-card-sub{font-size:.82rem;color:var(--cs-mut);margin-top:2px}

.csacefa-steps-mini{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin-bottom:1.5rem;font-size:.75rem;color:var(--cs-mut)}
.csacefa-step-mini{padding:4px 10px;border-radius:20px;background:var(--cs-bg)}
.csacefa-step-mini.active{background:var(--cs-pl);color:var(--cs-pd);font-weight:600}
.csacefa-step-mini.done{background:var(--cs-okl);color:var(--cs-ok)}
.csacefa-step-mini-arrow{color:var(--cs-bdrm)}

.csacefa-section-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--cs-p);margin:1.25rem 0 .6rem;padding-bottom:4px;border-bottom:1px solid var(--cs-bdr);display:flex;align-items:center;gap:8px}
.csacefa-hint-text{font-size:.82rem;color:var(--cs-mut);margin-bottom:.75rem}

.csacefa-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.csacefa-col-2{grid-column:span 2}
@media(max-width:580px){.csacefa-grid-2{grid-template-columns:1fr}.csacefa-col-2{grid-column:span 1}}

.csacefa-field{display:flex;flex-direction:column;gap:5px}
.csacefa-field label{font-size:.8rem;font-weight:600;color:var(--cs-mut)}
.csacefa-field input,.csacefa-field select,.csacefa-field textarea{font-family:var(--ff);font-size:.9rem;color:var(--cs-text);padding:10px 13px;border:1.5px solid var(--cs-bdr);border-radius:var(--rs);background:#FAFCFB;transition:border-color .18s,box-shadow .18s,background .18s;width:100%}
.csacefa-field input:focus,.csacefa-field select:focus,.csacefa-field textarea:focus{outline:none;border-color:var(--cs-p);background:#FCFFFE;box-shadow:0 0 0 3px rgba(0,85,82,.1)}
.csacefa-field input::placeholder,.csacefa-field textarea::placeholder{color:#B0CCCB;font-weight:300}
.csacefa-field textarea{resize:vertical;min-height:80px}
.csacefa-field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23005552' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:36px;cursor:pointer;-webkit-appearance:none;appearance:none}
.req{color:var(--cs-err);font-size:.85em}

.csacefa-pw-wrap{position:relative}
.csacefa-pw-wrap input{padding-right:62px}
.csacefa-pw-toggle{position:absolute;right:1px;top:1px;bottom:1px;background:none;border:none;border-radius:0 var(--rs) var(--rs) 0;font-size:.72rem;font-weight:700;color:var(--cs-p);cursor:pointer;padding:0 12px;font-family:var(--ff);letter-spacing:.04em;text-transform:uppercase;transition:background .15s}
.csacefa-pw-toggle:hover{background:var(--cs-pl)}

.csacefa-region-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.csacefa-region-option{display:flex;align-items:center;gap:7px;padding:9px 12px;border:1.5px solid var(--cs-bdr);border-radius:var(--rs);cursor:pointer;font-size:.82rem;font-weight:500;transition:border-color .15s,background .15s;background:#FAFCFB}
.csacefa-region-option:hover{border-color:var(--cs-p);background:var(--cs-pl)}
.csacefa-region-option input[type=radio]{accent-color:var(--cs-p)}
@media(max-width:580px){.csacefa-region-grid{grid-template-columns:repeat(2,1fr)}}

.csacefa-checkbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px;margin-bottom:.5rem}
.csacefa-checkbox-item{display:flex;align-items:center;gap:6px;padding:7px 10px;border:1.5px solid var(--cs-bdr);border-radius:var(--rs);font-size:.8rem;cursor:pointer;transition:border-color .12s,background .12s}
.csacefa-checkbox-item:hover{border-color:var(--cs-p);background:var(--cs-pl)}
.csacefa-checkbox-item input{accent-color:var(--cs-p)}
.csacefa-states-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}

.csacefa-check-pill{display:flex;align-items:center;gap:5px;padding:5px 12px;border:1.5px solid var(--cs-bdrm);border-radius:20px;font-size:.8rem;cursor:pointer;transition:all .12s}
.csacefa-check-pill:hover{border-color:var(--cs-p);color:var(--cs-p)}
.csacefa-check-pill input{display:none}

.csacefa-checkbox-single label{display:flex;gap:8px;align-items:flex-start;font-size:.85rem;cursor:pointer;line-height:1.5}
.csacefa-checkbox-single input{margin-top:2px;accent-color:var(--cs-p)}
.csacefa-char-count{font-size:.75rem;color:var(--cs-mut);text-align:right;margin-top:2px}

/* Buttons */
.csacefa-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border-radius:var(--rs);font-family:var(--ff);font-size:.875rem;font-weight:500;cursor:pointer;border:1.5px solid var(--cs-bdrm);background:var(--cs-white);color:var(--cs-text);text-decoration:none;transition:background .15s,transform .1s,border-color .15s,box-shadow .15s;line-height:1}
.csacefa-btn:hover{background:var(--cs-bg)}
.csacefa-btn:active{transform:scale(.98)}
.csacefa-btn-primary{background:var(--cs-p);border-color:var(--cs-p);color:#fff;box-shadow:0 3px 12px rgba(0,85,82,.25)}
.csacefa-btn-primary:hover{background:var(--cs-pd);border-color:var(--cs-pd);box-shadow:0 5px 18px rgba(0,85,82,.32)}
.csacefa-btn-gold{background:var(--cs-gold);border-color:var(--cs-gold);color:#fff;box-shadow:0 3px 12px rgba(200,146,42,.25)}
.csacefa-btn-gold:hover{background:var(--cs-gd);border-color:var(--cs-gd)}
.csacefa-btn-full{width:100%;justify-content:center;padding:13px 18px;font-size:.925rem;font-weight:700}
.csacefa-btn-full:hover{transform:translateY(-1px)}
.csacefa-btn-white{background:#fff;border-color:rgba(255,255,255,.4);color:var(--cs-pd)}
.btn-text{display:flex;align-items:center;gap:6px}
.btn-loader{display:none;align-items:center;gap:8px}
.btn-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:csspin .7s linear infinite}
@keyframes csspin{to{transform:rotate(360deg)}}

/* Alerts */
.csacefa-alert{padding:11px 16px;border-radius:var(--rs);font-size:.875rem;margin-bottom:1rem;line-height:1.55}
.csacefa-alert-success{background:var(--cs-okl);color:var(--cs-ok);border:1px solid #A8DBBE}
.csacefa-alert-error,.csacefa-alert-danger{background:var(--cs-erl);color:var(--cs-err);border:1px solid #F5C4BE}
.csacefa-alert-info{background:var(--cs-pl);color:var(--cs-pd);border:1px solid var(--cs-bdr)}
.csacefa-alert-warning{background:var(--cs-wl);color:var(--cs-warn);border:1px solid #FCD34D}

.csacefa-login-link{font-size:.82rem;color:var(--cs-mut);margin-top:.75rem}
.csacefa-login-link a{color:var(--cs-p);font-weight:500}

/* Tabs */
.csacefa-tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:1.25rem;border-bottom:1px solid var(--cs-bdr)}
.csacefa-tab{padding:9px 18px;border:none;background:none;font-family:var(--ff);font-size:.83rem;color:var(--cs-mut);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .15s,border-color .15s}
.csacefa-tab:hover{color:var(--cs-p)}
.csacefa-tab.active{color:var(--cs-p);border-bottom-color:var(--cs-p);font-weight:600}
.csacefa-tab-content{display:none}
.csacefa-tab-content.active{display:block}
.csacefa-tab-nav{display:flex;gap:8px;justify-content:flex-end;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--cs-bdr)}

/* Doc uploads */
.csacefa-doc-upload-row{display:flex;align-items:center;gap:12px;padding:13px 16px;border:1.5px solid var(--cs-bdr);border-radius:var(--rs);margin-bottom:8px;background:#FAFCFB;transition:border-color .15s}
.csacefa-doc-upload-row:hover{border-color:var(--cs-p)}
.csacefa-doc-icon{font-size:1.25rem;flex-shrink:0}
.csacefa-doc-info{flex:1}
.csacefa-doc-label{font-size:.85rem;font-weight:600;margin-bottom:3px}
.csacefa-file-input{font-size:.8rem;color:var(--cs-mut);width:100%}
.csacefa-doc-status{flex-shrink:0}

.csacefa-projects-table-wrap{overflow-x:auto}
.csacefa-projects-table{width:100%;border-collapse:collapse;font-size:.82rem}
.csacefa-projects-table th{background:var(--cs-bg);padding:8px 10px;text-align:left;font-weight:600;border:1px solid var(--cs-bdr);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--cs-mut)}
.csacefa-projects-table td{border:1px solid var(--cs-bdr);padding:4px}
.csacefa-projects-table td input{width:100%;border:none;padding:6px 8px;font-size:.82rem;background:transparent;font-family:var(--ff)}
.csacefa-projects-table td input:focus{outline:none;background:var(--cs-pl)}

/* Badges */
.csacefa-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:.73rem;font-weight:600}
.csacefa-badge-success{background:var(--cs-okl);color:var(--cs-ok)}
.csacefa-badge-warning{background:var(--cs-wl);color:var(--cs-warn)}
.csacefa-badge-danger{background:var(--cs-erl);color:var(--cs-err)}
.csacefa-badge-info{background:var(--cs-pl);color:var(--cs-pd)}
.csacefa-badge-gold{background:var(--cs-gl);color:var(--cs-gd)}
.csacefa-badge-region{background:var(--cs-bg);color:var(--cs-mut)}

/* Dashboard */
.csacefa-dash-topbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;background:linear-gradient(135deg,var(--cs-pd) 0%,var(--cs-p) 60%,var(--cs-pm) 100%);border-radius:var(--r);padding:1.25rem 1.5rem;margin-bottom:1rem;box-shadow:var(--shl);color:#fff}
.csacefa-dash-welcome{display:flex;align-items:center;gap:14px}
.csacefa-avatar{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.15);border:2px solid rgba(255,255,255,.3);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--ffd);font-weight:600;font-size:.95rem;flex-shrink:0;overflow:hidden}
.csacefa-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.csacefa-dash-name{font-weight:600;font-size:1rem;color:#fff}
.csacefa-dash-org{font-size:.8rem;color:rgba(255,255,255,.7)}
.csacefa-dash-status-badges{display:flex;flex-wrap:wrap;gap:6px}

.csacefa-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:1.25rem}
@media(max-width:700px){.csacefa-stat-grid{grid-template-columns:repeat(2,1fr)}}
.csacefa-stat-card{background:var(--cs-white);border:1px solid var(--cs-bdr);border-radius:var(--rs);padding:.875rem 1rem;box-shadow:var(--sh)}
.csacefa-stat-label{font-size:.72rem;color:var(--cs-mut);margin-bottom:5px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.csacefa-stat-val{font-size:1.05rem;font-weight:600}
.csacefa-green{color:var(--cs-ok)}.csacefa-amber{color:var(--cs-warn)}.csacefa-gray{color:var(--cs-mut)}
.csacefa-mono{font-family:var(--ffm);font-size:.88rem}

.csacefa-dash-cols{display:grid;grid-template-columns:1fr 360px;gap:1rem}
@media(max-width:900px){.csacefa-dash-cols{grid-template-columns:1fr}}

.csacefa-action-card{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--cs-white);border:1px solid var(--cs-bdr);border-radius:var(--r);padding:1.1rem 1.25rem;margin-bottom:.75rem;box-shadow:var(--sh)}
.csacefa-action-urgent{border-left:3px solid var(--cs-warn)}
.csacefa-action-info{border-left:3px solid var(--cs-p)}
.csacefa-action-pay{border-left:3px solid var(--cs-gold)}
.csacefa-action-icon{font-size:1.5rem;flex-shrink:0}
.csacefa-action-title{font-size:.9rem;font-weight:600;margin-bottom:2px}
.csacefa-action-sub{font-size:.8rem;color:var(--cs-mut)}
.csacefa-action-card>div:nth-child(2){flex:1}

/* Certificate */
.csacefa-cert-card{background:linear-gradient(145deg,var(--cs-pd) 0%,var(--cs-p) 60%,var(--cs-pm) 100%);border-radius:var(--r);padding:1.75rem;color:#fff;margin-bottom:.75rem;text-align:center;position:relative;overflow:hidden}
.csacefa-cert-card::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='40' height='40' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='20' cy='20' r='1.5' fill='%23ffffff' fill-opacity='0.06'/%3E%3C/svg%3E")}
.csacefa-cert-seal{width:70px;height:70px;border-radius:50%;background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}
.csacefa-cert-seal svg{width:38px;height:38px}
.csacefa-cert-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;opacity:.7;margin-bottom:4px}
.csacefa-cert-name{font-family:var(--ffd);font-size:1.15rem;font-weight:600;margin-bottom:2px}
.csacefa-cert-org{font-size:.8rem;opacity:.75;margin-bottom:8px}
.csacefa-cert-code{font-family:var(--ffm);font-size:1.1rem;letter-spacing:.14em;margin:.5rem 0 2px;color:var(--cs-gold);font-weight:500}
.csacefa-cert-issued{font-size:.75rem;opacity:.65}
.csacefa-cert-actions{margin-top:1.25rem;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}

/* Panel */
.csacefa-panel{background:var(--cs-white);border:1px solid var(--cs-bdr);border-radius:var(--r);padding:1.1rem 1.25rem;margin-bottom:.75rem;box-shadow:var(--sh)}
.csacefa-panel-head{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--cs-mut);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--cs-bdr)}

/* Feed */
.csacefa-empty-feed{font-size:.82rem;color:var(--cs-mut);padding:.5rem 0}
.csacefa-feed{display:flex;flex-direction:column;gap:10px;max-height:500px;overflow-y:auto}
.csacefa-feed-item{border:1px solid var(--cs-bdr);border-radius:var(--rs);padding:.75rem}
.csacefa-feed-header{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.csacefa-feed-avatar{width:30px;height:30px;border-radius:50%;background:var(--cs-pl);color:var(--cs-p);display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:600;flex-shrink:0}
.csacefa-feed-author{font-size:.8rem;font-weight:600}
.csacefa-feed-date{font-size:.72rem;color:var(--cs-mut)}
.csacefa-feed-title{font-size:.88rem;font-weight:600;margin-bottom:3px}
.csacefa-feed-desc{font-size:.8rem;color:var(--cs-mut);margin-bottom:6px;line-height:1.5}
.csacefa-feed-photos{display:flex;gap:4px;flex-wrap:wrap}
.csacefa-feed-photo{width:70px;height:60px;object-fit:cover;border-radius:4px}

/* Modal */
.csacefa-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:9999;display:flex;align-items:center;justify-content:center;padding:1rem}
.csacefa-modal{background:var(--cs-white);border-radius:var(--r);max-width:540px;width:100%;max-height:90vh;overflow-y:auto;padding:1.5rem;box-shadow:0 12px 48px rgba(0,0,0,.25);position:relative}
.csacefa-modal-head{font-family:var(--ffd);font-size:1.1rem;font-weight:600;margin-bottom:1.25rem;padding-bottom:.75rem;border-bottom:1px solid var(--cs-bdr);display:flex;justify-content:space-between;align-items:center}
.csacefa-modal-close{background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--cs-mut)}

.csacefa-payment-bank-box{background:var(--cs-pl);border-radius:var(--rs);padding:1rem;margin-bottom:1.25rem}
.csacefa-bank-row{display:flex;justify-content:space-between;padding:6px 0;font-size:.85rem;border-bottom:1px solid rgba(0,85,82,.1)}
.csacefa-bank-row:last-child{border:none}
.csacefa-bank-row span{color:var(--cs-pd);font-weight:500}