/* admin/assets/css/admin.css */
:root{
    --bg:#f4f6f9;
    --sidebar-bg:#111827;
    --sidebar-border:#1f2937;
    --accent:#e63946;
    --accent-dark:#c62828;
    --text:#111827;
    --muted:#6b7280;
    --border-light:#e5e7eb;
    --success-bg:#e6f4ea;
    --success-text:#2e7d32;
    --error-bg:#fdecea;
    --error-text:#c62828;
    --info-bg:#e3f2fd;
    --info-text:#1565c0;
    --warning-bg:#fff8e1;
    --warning-text:#f57f17;
}

*{box-sizing:border-box;margin:0;padding:0}
body{
    font-family:"Inter",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
    background:var(--bg);
    display:flex;
    min-height:100vh;
    color:var(--text);
    font-size:14px;
}

/* SIDEBAR */
.sidebar{
    width:260px;
    min-height:100vh;
    background:var(--sidebar-bg);
    border-right:1px solid var(--sidebar-border);
    position:fixed;
    inset:0 auto 0 0;
    display:flex;
    flex-direction:column;
    overflow-y:auto;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE and Edge */
}
.sidebar::-webkit-scrollbar { /* Chrome, Safari, Opera */
    display: none;
}
.logo{
    padding:18px 18px 16px;
    border-bottom:1px solid var(--sidebar-border);
}
.logo-main{
    font-size:18px;
    font-weight:700;
    color:#f9fafb;
    display:flex;
    align-items:center;
    gap:8px;
}
.logo-main span{
    color:var(--accent);
}
.logo-sub{
    font-size:11px;
    color:#9ca3af;
    margin-top:4px;
}

.nav-group-title{
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#6b7280;
    padding:14px 18px 6px;
    font-weight:600;
}
.nav-link{
    display:flex;
    align-items:center;
    padding:10px 18px;
    color:#d1d5db;
    font-size:13px;
    text-decoration:none;
    border-left:3px solid transparent;
    transition:.15s;
    gap:10px;
}
.nav-link:hover, .nav-link.active{
    background:#1f2937;
    color:#fff;
    border-left-color:var(--accent);
}
.nav-link i{
    font-size:15px;
    width:20px;
    text-align:center;
}

/* MAIN CONTENT */
.main-content{
    margin-left:260px;
    width:calc(100% - 260px);
    min-height:100vh;
    display:flex;
    flex-direction:column;
}
.topbar{
    background:#fff;
    padding:12px 22px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    border-bottom:1px solid var(--border-light);
    position:sticky;
    top:0;
    z-index:10;
}
.topbar h2{
    font-size:16px;
    font-weight:600;
    display:flex;
    align-items:center;
    gap:8px;
    color:var(--text);
}
.user-info{
    font-size:13px;
    color:var(--muted);
    display:flex;
    align-items:center;
    gap:10px;
}
.user-info .btn{
    padding:6px 12px;
    font-size:12px;
    border-radius:6px;
}

.page-wrapper{
    padding:22px;
    flex-grow:1;
}

/* ALERTS */
.alert{
    padding:12px 18px;
    border-radius:8px;
    margin-bottom:20px;
    font-size:13px;
    display:flex;
    align-items:center;
    gap:10px;
}
.alert-success{background:var(--success-bg);color:var(--success-text);border:1px solid #a5d6a7;}
.alert-error{background:var(--error-bg);color:var(--error-text);border:1px solid #ef9a9a;}
.alert-warning{background:var(--warning-bg);color:var(--warning-text);border:1px solid #ffcc80;}
.alert i{font-size:16px;}

/* CARD / TABLE / FORM */
.card{
    background:#fff;
    border-radius:10px;
    padding:20px;
    box-shadow:0 2px 8px rgba(0,0,0,.07);
    margin-bottom:20px;
}
.card-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
    padding-bottom:12px;
    border-bottom:1px solid var(--border-light);
}
.card-header h3{
    font-size:16px;
    color:var(--text);
    font-weight:600;
}
table{
    width:100%;
    border-collapse:collapse;
    font-size:13px;
}
th{
    background:#f8f9fa;
    padding:10px 12px;
    text-align:left;
    color:#555;
    font-weight:600;
    border-bottom:2px solid var(--border-light);
}
td{
    padding:10px 12px;
    border-bottom:1px solid #f0f0f0;
    color:var(--text);
}
tr:hover td{background:#fafafa;}
.table-responsive{
    overflow-x:auto;
}

/* BADGES */
.badge{
    display:inline-flex;
    align-items:center;
    padding:4px 10px;
    border-radius:999px;
    font-size:11px;
    font-weight:600;
    line-height:1;
}
.badge-success{background:var(--success-bg);color:var(--success-text);}
.badge-info{background:var(--info-bg);color:var(--info-text);}
.badge-warning{background:var(--warning-bg);color:var(--warning-text);}
.badge-error{background:var(--error-bg);color:var(--error-text);}
.badge-secondary{background:#e0e0e0;color:#424242;}

/* BUTTONS */
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 16px;
    border-radius:8px;
    font-size:13px;
    font-weight:600;
    text-decoration:none;
    border:none;
    cursor:pointer;
    transition:.15s;
    gap:6px;
}
.btn-primary{background:var(--accent);color:#fff;}
.btn-primary:hover{background:var(--accent-dark);}
.btn-secondary{background:#e0e0e0;color:#424242;}
.btn-secondary:hover{background:#bdbdbd;}
.btn-danger{background:#ef5350;color:#fff;}
.btn-danger:hover{background:#d32f2f;}
.btn-sm{padding:6px 12px;font-size:12px;border-radius:6px;}
.btn-full{width:100%;}

/* FORMS */
.form-group{margin-bottom:16px;}
.form-group label{
    display:block;
    font-size:13px;
    font-weight:600;
    color:#555;
    margin-bottom:6px;
}
.form-control{
    width:100%;
    padding:10px 14px;
    border:1px solid var(--border-light);
    border-radius:8px;
    font-size:14px;
    outline:none;
    font-family:inherit;
    color:var(--text);
    background:#fff;
    transition:.15s;
}
.form-control:focus{
    border-color:var(--accent);
    box-shadow:0 0 0 3px rgba(var(--accent-rgb),.1);
}
textarea.form-control{resize:vertical;}
.form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
.form-check{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:8px;
}
.form-check input[type="checkbox"]{
    width:16px;
    height:16px;
    accent-color:var(--accent);
}
.form-check label{
    margin-bottom:0;
    font-weight:400;
    color:var(--text);
}

/* UPLOAD */
.drop-area{
    border:2px dashed var(--border-light);
    border-radius:10px;
    padding:28px;
    text-align:center;
    cursor:pointer;
    background:#fafafa;
    transition:.15s;
}
.drop-area:hover{
    border-color:var(--accent);
    background:#fff5f5;
}
.drop-area input[type="file"]{
    display:none;
}
.drop-area p{
    color:var(--muted);
    font-size:13px;
    margin-top:8px;
}
.drop-area i{
    font-size:36px;
    color:var(--muted);
}
.preview-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(90px,1fr));
    gap:8px;
    margin-top:15px;
}
.preview-grid img{
    width:100%;
    height:80px;
    object-fit:cover;
    border-radius:6px;
    border:1px solid var(--border-light);
}
.photo-gallery{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
    gap:15px;
    margin-bottom:20px;
}
.photo-item{
    border:1px solid var(--border-light);
    border-radius:8px;
    overflow:hidden;
    position:relative;
    background:#fff;
    box-shadow:0 1px 4px rgba(0,0,0,.05);
}
.photo-item.is-principal{
    border-color:var(--accent);
    box-shadow:0 0 0 2px var(--accent);
}
.photo-item img{
    width:100%;
    height:120px;
    object-fit:cover;
    display:block;
}
.photo-item-actions{
    display:flex;
    gap:5px;
    padding:8px;
    background:#f9f9f9;
    border-top:1px solid var(--border-light);
}
.photo-item-actions .btn{
    flex:1;
    padding:5px 8px;
    font-size:11px;
    border-radius:5px;
}
.tag-principal{
    position:absolute;
    top:8px;
    left:8px;
    background:var(--accent);
    color:#fff;
    font-size:10px;
    font-weight:700;
    padding:3px 8px;
    border-radius:999px;
}
video{
    width:100%;
    border-radius:8px;
    max-height:250px;
    margin-bottom:15px;
    background:#000;
}
iframe{
    width:100%;
    height:200px;
    border-radius:8px;
    margin-bottom:15px;
    border:none;
}