/* Fondo general */
.panel-body{
    background:#1f3f59;
    margin:0;
    font-family:'Segoe UI', sans-serif;
}

/* Header superior */
.admin-header{
    background:#065f46;
    color:white;
    padding:15px 20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.admin-header .title{
    font-size:20px;
    font-weight:bold;
}

.admin-header .links a{
    margin-left:15px;
    color:white;
    text-decoration:none;
    font-weight:bold;
}

.admin-header .links a.logout{
    color:#fca5a5;
}

.admin-header .links a:hover{
    text-decoration:underline;
}

/* Contenido */
.admin-container{
    width:600px;
    margin:40px auto;
    background:white;
    padding:25px;
    border-radius:14px;
    box-shadow:0 8px 20px rgba(0,0,0,0.1);
}

/* Títulos */
h2{
    margin-top:0;
    color:#065f46;
}

/* Formulario */
.form-admin label{
    font-weight:bold;
    margin-top:15px;
    display:block;
}

.form-admin input,
.form-admin textarea{
    width:100%;
    padding:10px;
    margin-top:5px;
    border:1px solid #cbd5e1;
    border-radius:8px;
    font-size:15px;
}

textarea{
    height:100px;
    resize:none;
}

.btn-guardar{
    width:100%;
    margin-top:25px;
    padding:12px;
    background:#059669;
    color:white;
    border:none;
    border-radius:8px;
    font-size:16px;
    cursor:pointer;
    font-weight:bold;
}

.btn-guardar:hover{
    background:#047857;
}

/* Nota */
.nota{
    margin-top:15px;
    font-size:14px;
    color:#374151;
}

/* =========================================================
   Header (compat: páginas nuevas y viejas)
   ========================================================= */

/* Mantener compatibilidad con versiones anteriores */
.admin-header .title{ font-size:20px; font-weight:bold; }
.admin-header .links a{ margin-left:15px; color:white; text-decoration:none; font-weight:bold; }
.admin-header .links a.logout{ color:#fca5a5; }
.admin-header .links a:hover{ text-decoration:underline; }

/* Versión actual (testimonios.php) */
.admin-header-left .admin-title{
    margin:0;
    font-size:20px;
    font-weight:700;
    letter-spacing:0.2px;
}

.admin-menu{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    align-items:center;
    justify-content:flex-end;
}

.admin-menu a{
    color:#fff;
    text-decoration:none;
    font-weight:600;
    font-size:14px;
    padding:7px 10px;
    border-radius:999px;
    transition:background .15s ease, opacity .15s ease;
}

.admin-menu a:hover{ background:rgba(255,255,255,.14); }

.admin-menu a.activo{
    background:rgba(255,255,255,.22);
}

/* =========================================================
   Contenedores
   ========================================================= */
.admin-container-wide{
    width: min(1100px, calc(100% - 40px));
}

/* =========================================================
   Alertas
   ========================================================= */
.alerta{
    padding:12px 14px;
    border-radius:10px;
    margin:14px 0;
    font-weight:600;
}
.alerta-exito{ background:#ecfdf5; color:#065f46; border:1px solid #a7f3d0; }
.alerta-error{ background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }

/* =========================================================
   Tabla admin
   ========================================================= */
.tabla-admin{
    width:100%;
    border-collapse:separate;
    border-spacing:0;
    margin-top:18px;
    overflow:hidden;
    border-radius:12px;
    border:1px solid #e5e7eb;
}

.tabla-admin thead th{
    background:#f3f4f6;
    color:#111827;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.04em;
    padding:12px 10px;
    text-align:left;
}

.tabla-admin tbody td{
    padding:12px 10px;
    border-top:1px solid #e5e7eb;
    vertical-align:top;
    font-size:14px;
    color:#111827;
}

.tabla-admin tbody tr:hover{ background:#f9fafb; }

.fila-pendiente{ background:#fff; }
.fila-aprobado{ background:#f8fff9; }

/* Mensajes largos */
.tabla-admin-testimonios td:nth-child(5){
    max-width:520px;
    white-space:normal;
    word-break:break-word;
    line-height:1.35;
}

/* =========================================================
   Badges de estado
   ========================================================= */
.badge{
    display:inline-flex;
    align-items:center;
    padding:6px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    border:1px solid transparent;
}
.badge-ok{ background:#ecfdf5; color:#065f46; border-color:#a7f3d0; }
.badge-pending{ background:#fffbeb; color:#92400e; border-color:#fde68a; }

/* =========================================================
   Acciones (botones)
   ========================================================= */
.acciones{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.form-accion{ margin:0; }

.btn-accion{
    appearance:none;
    border:none;
    border-radius:10px;
    padding:9px 12px;
    font-weight:700;
    cursor:pointer;
    font-size:13px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    box-shadow:0 6px 14px rgba(0,0,0,0.10);
    transition:transform .12s ease, filter .12s ease;
}

.btn-accion:hover{ transform:translateY(-1px); filter:brightness(0.98); }
.btn-accion:active{ transform:translateY(0px); }

.btn-ico{ font-weight:900; line-height:1; }

.btn-verde{ background:#10b981; color:#fff; }
.btn-amarillo{ background:#f59e0b; color:#111827; }
.btn-rojo{ background:#ef4444; color:#fff; }

/* Responsive simple */
@media (max-width: 720px){
    .admin-container{ width: calc(100% - 40px); }
    .tabla-admin{ display:block; overflow-x:auto; }
}