:root{
  --aap-orange:#ff6b00;
  --aap-blue:#002169;
  --aap-bg:#f4f6fa;
  --aap-card:#fff;
  --aap-border:#dde3ec;
  --aap-text:#1b2430;
  --aap-muted:#6b7280;
}

*{box-sizing:border-box}

body.aap-body{
  margin:0;
  background:var(--aap-bg);
  color:var(--aap-text);
  font-family:'MuseoModerno', Verdana, Arial, sans-serif;
}

/* HEADER */
.aap-header{
  background:#fff;
  padding:14px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:4px solid var(--aap-orange);
  box-shadow:0 6px 20px rgba(0,33,105,.08);
  position:sticky;
  top:0;
  z-index:1000;
}

.aap-header-left{
  display:flex;
  align-items:center;
  gap:12px;
}

.aap-logo{width:64px}

.aap-header-title{
  color:var(--aap-blue);
  font-weight:800;
  font-size:1.25rem;
}

.aap-header-right{
  display:flex;
  align-items:center;
  gap:12px;
}

.aap-header-link,
.aap-header-btn{
  text-decoration:none;
  font-weight:800;
  color:var(--aap-blue);
}

.aap-header-btn{
  background:var(--aap-orange);
  color:#fff;
  padding:10px 16px;
  border-radius:14px;
}

/* LAYOUT */
.aap-main{
  padding:24px;
}

.portal-layout{
  display:grid;
  grid-template-columns:280px minmax(0, 1fr);
  gap:24px;
  align-items:start;
}

.portal-content{
  min-width:0;
  width:100%;
}

/* SIDEBAR */
.portal-sidebar{
  background:var(--aap-blue);
  color:#fff;
  padding:22px 18px;
  border-radius:24px;
  min-height:calc(100vh - 150px);
  box-shadow:0 14px 32px rgba(0,33,105,.25);
}

.sidebar-userbox{
  display:flex;
  align-items:center;
  gap:12px;
  padding-bottom:18px;
  margin-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.2);
}

.sidebar-user-avatar{
  width:48px;
  height:48px;
  border-radius:16px;
  background:var(--aap-orange);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
}

.sidebar-user-name{
  color:#fff;
  font-weight:800;
}

.sidebar-user-email{
  color:rgba(255,255,255,.78);
  font-size:.82rem;
  word-break:break-all;
}

.sidebar-nav{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.sidebar-link{
  color:#fff !important;
  text-decoration:none;
  padding:13px 15px;
  border-radius:16px;
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
}

.sidebar-link.active,
.sidebar-link:hover{
  background:var(--aap-orange);
}

/* CARDS */
.portal-card,
.card,
.credencial-preview-card{
  background:#fff;
  border:1px solid var(--aap-border);
  border-radius:24px;
  padding:26px;
  box-shadow:0 12px 30px rgba(0,33,105,.08);
}

h1,h2,h3{
  color:var(--aap-blue);
  font-weight:800;
}

/* BUTTONS */
.btn-aap,
.btn-credencial,
.btn-primary,
button[type="submit"],
input[type="submit"]{
  background:var(--aap-orange) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:14px !important;
  padding:12px 22px !important;
  font-weight:800 !important;
  text-decoration:none !important;
}

/* FORMS */
input,select,textarea,
.form-control,.form-select{
  width:100%;
  border:1px solid var(--aap-border) !important;
  border-radius:14px !important;
  padding:12px 14px !important;
  font-family:'MuseoModerno', Verdana, Arial, sans-serif;
}

/* PDF */
.pdf-viewer-box{
  width:100%;
  height:720px;
  background:#222;
  border-radius:18px;
  overflow:hidden;
}

.pdf-viewer-box iframe{
  width:100%;
  height:100%;
  border:0;
}

.credencial-actions{
  margin-top:28px;
  display:flex;
  justify-content:center;
}

.aap-footer{
  text-align:center;
  padding:20px;
  color:var(--aap-muted);
}

/* MOBILE MENU */
.mobile-menu-btn,
.mobile-close-btn{
  display:none;
}

/* MOBILE */
@media(max-width:900px){

  .aap-header{
    padding:10px 12px;
    display:grid;
    grid-template-columns:1fr auto;
    gap:8px;
  }

  .aap-logo{width:46px}

  .aap-header-title{
    font-size:.98rem;
  }

  .aap-header-right{
    grid-column:1 / -1;
    display:flex;
  }

  .aap-header-user{
    flex:1;
    font-size:.9rem;
  }

  .aap-header-link{
    background:#eef2fb;
    padding:9px 14px;
    border-radius:12px;
  }

  .desktop-only{
    display:none !important;
  }

  .mobile-menu-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border:0;
    border-radius:14px;
    background:var(--aap-orange);
    color:#fff;
    font-size:1.35rem;
    font-weight:800;
  }

  .mobile-close-btn{
    display:block;
    width:100%;
    border:0;
    background:rgba(255,255,255,.14);
    color:#fff;
    padding:12px;
    border-radius:14px;
    margin-bottom:16px;
    font-weight:800;
    text-align:left;
  }

  .aap-main{
    padding:12px;
  }

  .portal-layout{
    display:block;
  }

  .portal-content{
    display:block;
    width:100%;
    min-height:300px;
  }

  .portal-sidebar{
    position:fixed;
    top:0;
    left:-100%;
    width:86%;
    max-width:340px;
    height:100vh;
    min-height:100vh;
    z-index:2000;
    border-radius:0 24px 24px 0;
    overflow-y:auto;
    transition:left .25s ease;
  }

  body.menu-open .portal-sidebar{
    left:0;
  }

  body.menu-open::after{
    content:"";
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.45);
    z-index:1999;
  }

  .portal-card,
  .card,
  .credencial-preview-card{
    padding:16px;
    border-radius:20px;
  }

  .pdf-viewer-box{
    height:420px;
  }

  .btn-aap,
  .btn-credencial,
  .btn-primary{
    width:100%;
  }
}
/* PUBLIC LOGIN / REGISTRO CENTRADO EN ESCRITORIO */
body:not(.user-authenticated) .portal-layout,
.portal-layout.public-layout{
  display:flex !important;
  justify-content:center !important;
  align-items:flex-start !important;
  width:100% !important;
}

body:not(.user-authenticated) .portal-content,
.portal-layout.public-layout .portal-content{
  max-width:460px !important;
  width:100% !important;
  margin:0 auto !important;
}

.login-card,
.registro-card,
.solicitud-card,
.public-card,
.portal-login-card{
  max-width:420px !important;
  width:100% !important;
  margin:10px auto 0 !important;
}
/* FORMULARIO PÚBLICO DE SOLICITUD MÁS ANCHO */
body:not(.user-authenticated) .portal-content{
  max-width:960px !important;
  width:100% !important;
  margin:0 auto !important;
}

/* Card de solicitud */
body:not(.user-authenticated) .solicitud-card,
body:not(.user-authenticated) .registro-card,
body:not(.user-authenticated) .public-card{
  max-width:900px !important;
  width:100% !important;
  margin:60px auto !important;
}

/* Login sigue más chico */
body:not(.user-authenticated) .login-card,
body:not(.user-authenticated) .portal-login-card{
  max-width:420px !important;
  width:100% !important;
  margin:80px auto 0 !important;
}

/* Campos en dos columnas dentro de solicitud */
body:not(.user-authenticated) .solicitud-card form,
body:not(.user-authenticated) .registro-card form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 22px;
}

/* Elementos que deben ocupar todo el ancho */
body:not(.user-authenticated) .solicitud-card form .full-width,
body:not(.user-authenticated) .registro-card form .full-width,
body:not(.user-authenticated) .solicitud-card form button,
body:not(.user-authenticated) .registro-card form button,
body:not(.user-authenticated) .solicitud-card form input[type="submit"],
body:not(.user-authenticated) .registro-card form input[type="submit"]{
  grid-column:1 / -1;
}

/* Textos superiores también centrados y más cómodos */
body:not(.user-authenticated) .solicitud-card h1,
body:not(.user-authenticated) .registro-card h1,
body:not(.user-authenticated) .solicitud-card p,
body:not(.user-authenticated) .registro-card p{
  grid-column:1 / -1;
}

/* Mobile: una sola columna */
@media(max-width:768px){
  body:not(.user-authenticated) .portal-content{
    max-width:100% !important;
  }

  body:not(.user-authenticated) .solicitud-card,
  body:not(.user-authenticated) .registro-card,
  body:not(.user-authenticated) .public-card{
    max-width:100% !important;
    margin:20px auto !important;
  }

  body:not(.user-authenticated) .solicitud-card form,
  body:not(.user-authenticated) .registro-card form{
    grid-template-columns:1fr;
  }
}
/* FIX FORMULARIO SOLICITUD */
body:not(.user-authenticated) .solicitud-card form,
body:not(.user-authenticated) .registro-card form{
  display:block !important;
}

body:not(.user-authenticated) .form-section,
body:not(.user-authenticated) .section-title,
body:not(.user-authenticated) fieldset{
  width:100%;
  margin:28px 0 18px;
}

body:not(.user-authenticated) .section-title,
body:not(.user-authenticated) fieldset legend{
  color:var(--aap-blue);
  font-size:1.15rem;
  font-weight:800;
  text-transform:uppercase;
  border-bottom:2px solid var(--aap-orange);
  padding-bottom:8px;
  margin-bottom:18px;
}

body:not(.user-authenticated) .form-row,
body:not(.user-authenticated) .row{
  display:grid !important;
  grid-template-columns:1fr 1fr;
  gap:18px 22px;
  align-items:start;
}

body:not(.user-authenticated) .mb-3,
body:not(.user-authenticated) .form-group{
  margin-bottom:18px;
}

@media(max-width:768px){
  body:not(.user-authenticated) .form-row,
  body:not(.user-authenticated) .row{
    grid-template-columns:1fr !important;
  }
}
/* FIX MEMBRESÍA / RADIO / CHECKBOX */
.tipo-membresia-box,
.membresia-box,
.reglamento-box{
  display:block !important;
  grid-column:1 / -1;
  width:100%;
}

.tipo-membresia-box ul,
.membresia-box ul{
  list-style:none;
  padding:0;
  margin:12px 0 0;
}

.tipo-membresia-box li,
.membresia-box li{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  border:1px solid #ffd5bd;
  border-radius:14px;
  margin-bottom:12px;
  background:#fff8f3;
}

.tipo-membresia-box input[type="radio"],
.membresia-box input[type="radio"],
.reglamento-box input[type="checkbox"]{
  width:18px !important;
  height:18px !important;
  padding:0 !important;
  margin:4px 0 0 !important;
  flex:0 0 auto;
  accent-color:var(--aap-orange);
}

.tipo-membresia-box label,
.membresia-box label,
.reglamento-box label{
  display:flex;
  align-items:flex-start;
  gap:12px;
  width:100%;
  cursor:pointer;
}

.reglamento-box{
  margin-top:18px;
  padding:14px 16px;
  background:#fff;
  border:1px solid var(--aap-border);
  border-radius:14px;
}

.reglamento-box label{
  color:var(--aap-text);
  line-height:1.45;
}
/* MEMBRESÍA - FORMULARIO PÚBLICO */
.membresia-card{
  grid-column:1 / -1;
  background:#fff7f2;
  border:1px solid #ffd6bf;
  border-left:5px solid var(--aap-orange);
  border-radius:18px;
  padding:22px;
  margin:14px 0 18px;
}

.membresia-info{
  background:#fff;
  border:1px solid var(--aap-border);
  border-radius:16px;
  padding:18px;
  margin-bottom:18px;
}

.membresia-info h4{
  margin:0 0 12px;
  color:var(--aap-blue);
  font-size:1.05rem;
}

.membresia-info ul{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.membresia-info li{
  background:#f8fafc;
  border-radius:14px;
  padding:14px;
}

.membresia-info strong,
.membresia-info span{
  display:block;
}

.membresia-info strong{
  color:var(--aap-blue);
  font-weight:800;
}

.membresia-info span{
  color:#374151;
  font-size:.9rem;
  margin-top:4px;
}

.membresia-text{
  margin:0 0 14px;
  color:#374151;
}

.membresia-options{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.membresia-option{
  display:flex;
  align-items:flex-start;
  gap:12px;
  background:#fff;
  border:1px solid #ffd6bf;
  border-radius:16px;
  padding:16px;
  cursor:pointer;
}

.membresia-option:hover{
  border-color:var(--aap-orange);
  box-shadow:0 8px 20px rgba(255,107,0,.12);
}

.membresia-option input[type="radio"]{
  width:18px !important;
  height:18px !important;
  margin-top:4px !important;
  padding:0 !important;
  accent-color:var(--aap-orange);
  flex:0 0 auto;
}

.membresia-option strong{
  display:block;
  color:var(--aap-blue);
  font-weight:800;
}

.membresia-option small{
  display:block;
  color:#6b7280;
  margin-top:4px;
  line-height:1.35;
}

.reglamento-actions{
  grid-column:1 / -1;
  margin:8px 0 16px;
}

.btn-reglamento{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--aap-blue);
  color:#fff !important;
  text-decoration:none;
  border-radius:14px;
  padding:12px 18px;
  font-weight:800;
}

.acepta-box{
  grid-column:1 / -1;
  display:flex;
  align-items:flex-start;
  gap:12px;
  background:#fff;
  border:1px solid var(--aap-border);
  border-radius:16px;
  padding:16px;
  cursor:pointer;
}

.acepta-box input[type="checkbox"]{
  width:18px !important;
  height:18px !important;
  margin-top:4px !important;
  padding:0 !important;
  accent-color:var(--aap-orange);
  flex:0 0 auto;
}

.acepta-box span{
  color:var(--aap-text);
  line-height:1.45;
}

.form-submit-row{
  grid-column:1 / -1;
}

@media(max-width:768px){
  .membresia-info ul,
  .membresia-options{
    grid-template-columns:1fr;
  }

  .btn-reglamento{
    width:100%;
  }
}
.btn-pagar-aap{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    background:linear-gradient(
        135deg,
        #ff7a00,
        #ff5e00
    );

    color:#fff !important;
    text-decoration:none !important;

    padding:12px 24px;
    border-radius:14px;

    font-weight:700;
    font-size:15px;

    box-shadow:0 8px 18px rgba(255,122,0,.35);

    transition:.25s;
}

.btn-pagar-aap:hover{
    transform:translateY(-2px);
    color:#fff !important;
    box-shadow:0 12px 24px rgba(255,122,0,.45);
}

.btn-pagar-aap:active{
    transform:translateY(0);
}
.card-cuota-pendiente{
    background:#fff;
    border-left:5px solid #ff7a00;
    border-radius:18px;
    padding:18px;
    margin:15px 0;

    display:flex;
    justify-content:space-between;
    align-items:center;

    box-shadow:0 8px 20px rgba(0,0,0,.08);
}
.btn-aap-sm{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    background:linear-gradient(
        135deg,
        #ff7a00,
        #ff5e00
    );

    color:#fff !important;
    text-decoration:none !important;

    padding:12px 22px;
    border-radius:14px;

    font-weight:700;
    font-size:15px;

    border:none;

    box-shadow:0 8px 18px rgba(255,122,0,.30);

    transition:all .25s ease;
}

.btn-aap-sm:hover{
    color:#fff !important;
    transform:translateY(-2px);
    box-shadow:0 12px 24px rgba(255,122,0,.40);
}

.btn-aap-sm:active{
    transform:translateY(0);
}
.credencial-img-box{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:18px;
    background:#f4f6fa;
    border-radius:20px;
    border:1px solid var(--aap-border);
}

.credencial-img{
    width:100%;
    max-width:900px;
    height:auto;
    display:block;
    border-radius:16px;
    box-shadow:0 12px 28px rgba(0,33,105,.14);
}

.credencial-actions{
    margin-top:28px;
    display:flex;
    justify-content:center;
}

.empty-credencial{
    min-height:240px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:18px;
    text-align:center;
}

@media(max-width:768px){
    .credencial-img-box{
        padding:8px;
        border-radius:16px;
    }

    .credencial-img{
        max-width:100%;
        border-radius:12px;
    }

    .btn-credencial{
        width:100%;
    }
}
.opciones-pago-dashboard{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:20px;
}

.opcion-pago-card{
  background:#fff;
  border:1px solid #dde3ec;
  border-left:5px solid #ff6b00;
  border-radius:18px;
  padding:20px;
  box-shadow:0 10px 24px rgba(0,33,105,.08);
}

.opcion-pago-card h3{
  margin:0 0 0px;
  color:#002169;
}

.monto-pago{
  font-size:30px;
  font-weight:800;
  color:#002169;
  margin:8px 0;
}

.opcion-pago-card small{
  display:block;
  margin-bottom:16px;
  color:#6b7280;
}

@media(max-width:768px){
  .opciones-pago-dashboard{
    grid-template-columns:1fr;
  }
}
.dashboard-top-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
    margin-bottom:25px;
}

@media(max-width:992px){
    .dashboard-top-grid{
        grid-template-columns:1fr;
    }
    
}
.badge-credencial-ok{
    display:inline-block;
    background:#e8f7ee;
    color:#118a43;
    padding:4px 10px;
    border-radius:30px;
    font-size:12px;
    font-weight:700;
}

.badge-credencial-no{
    display:inline-block;
    background:#fdecec;
    color:#c62828;
    padding:4px 10px;
    border-radius:30px;
    font-size:12px;
    font-weight:700;
}
.btn-generar-mini{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-left:8px;
    padding:4px 10px;
    border-radius:20px;
    background:#ff6b00;
    color:#fff !important;
    font-size:12px;
    font-weight:800;
    text-decoration:none !important;
}

.btn-generar-mini:hover{
    background:#e85f00;
    color:#fff !important;
}
.btn-aap-sm{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#ff6b00;
  color:#fff !important;
  text-decoration:none !important;
  padding:12px 22px;
  border-radius:14px;
  font-weight:800;
  box-shadow:0 8px 18px rgba(255,107,0,.30);
}

.btn-aap-sm:hover{
  background:#e85f00;
  color:#fff !important;
}
.dashboard-top-grid,
.portal-card{
    /*max-width: 760px;*/
}
.portal-card-title{
    color:#002b5c;
    font-size:28px;
    font-weight:700;
    margin:0;
    padding-bottom:12px;
    border-bottom:2px solid #f36f21;
    display:inline-block;

.tabla-responsive-aap{
  width:100%;
  overflow-x:auto;
  margin-top:16px;
}

.tabla-aap{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
  border:1px solid #dde3ec;
  border-radius:18px;
  overflow:hidden;
}

.tabla-aap thead th{
  background:#002169;
  color:#fff;
  padding:14px 16px;
  text-align:left;
  font-weight:800;
  white-space:nowrap;
}

.tabla-aap tbody td{
  padding:14px 16px;
  border-top:1px solid #edf1f7;
  color:#1f2937;
  white-space:nowrap;
}

.tabla-aap tbody tr:hover td{
  background:#f8fafc;
}
.dashboard-card-small{
  max-width:760px;
}

.portal-card-title{
  color:#002169;
  font-size:30px;
  font-weight:800;
  margin:0 0 28px;
  padding-bottom:12px;
  border-bottom:2px solid #ff6b00;
  display:inline-block;
}

.cuota-item{
  background:#fff;
  border:1px solid #dde3ec;
  border-left:5px solid #ff6b00;
  border-radius:16px;
  padding:18px;
  margin:16px 0;
}

.cuota-item{
    background:#fff;
    border:1px solid #dde3ec;
    border-left:5px solid #ff6b00;
    border-radius:16px;
    padding:20px;
    margin-top:15px;
    box-shadow:0 3px 10px rgba(0,0,0,.04);
}

.panel-datos-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:15px;
}

.panel-datos-grid p{
    margin:0;
}
.dashboard-top-grid{
    display:grid;
    grid-template-columns: 1fr 1.3fr;
    gap:25px;
}