/* =====================================================
   DESIGN SYSTEM — SOU MAIS RÁDIOS (NOVA PALETA)
===================================================== */

:root {
    /* Nova Paleta de Cores */
    --smr-orange: #ff722e;
    --smr-black: #252525;
    --smr-orange-dark: #e66020; /* Tom mais escuro para hover */

    /* Neutros atualizados para harmonizar com a nova paleta */
    --smr-bg: #fafafa; /* Fundo ligeiramente mais quente */
    --smr-white: #ffffff;
    --smr-text: var(--smr-black); /* Cor de texto principal */
    --smr-muted: #666666; /* Cinza neutro para textos secundários */
    --smr-border: #e0e0e0; /* Borda neutra e suave */

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 14px;
}

/* =====================================================
   BASE
===================================================== */

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: 'Inter', sans-serif;
    background-color: var(--smr-bg);
    color: var(--smr-text);
    -webkit-font-smoothing: antialiased;
}

/* =====================================================
   HEADER
===================================================== */

.smr-header {
    background-color: var(--smr-white);
    border-bottom: 1px solid var(--smr-border);
}

.smr-header .container,
.smr-header .container-fluid {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 16px;
}

/* Brand (Logo e Subtítulo) */
.smr-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.smr-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.smr-logo-img {
    width: 260px; /* Ajuste este valor conforme necessário */
    height: auto;
    margin-bottom: 4px;
}

.smr-subtitle {
    font-size: 1rem;
    color: var(--smr-muted);
    padding-left: 5px;
}

/* Nav */
.smr-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 8px;
    border-top: 1px solid var(--smr-border);
}

.smr-nav a {
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--smr-text);
    transition: color 0.15s ease;
}

.smr-nav a:hover {
    color: var(--smr-orange); /* Destaque laranja no hover */
}

/* =====================================================
   MAIN / CONTENT
===================================================== */

.smr-main {
    min-height: calc(100vh - 120px);
}

.smr-content {
    margin-top: 16px;
}

/* =====================================================
   BUTTONS
===================================================== */

.btn-primary {
    background-color: var(--smr-orange); /* Botão primário laranja */
    border-color: var(--smr-orange);
}

.btn-primary:hover {
    background-color: var(--smr-orange-dark); /* Laranja mais escuro no hover */
    border-color: var(--smr-orange-dark);
}

/* =====================================================
   CARDS (GLOBAL)
===================================================== */

.card {
    border-radius: var(--radius-lg);
    border: 1px solid var(--smr-border);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.04);
}

/* =====================================================
   CAMPAIGN CARD (SAAS)
===================================================== */

.campaign-card-saas {
    background-color: var(--smr-white);
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.campaign-card-saas:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

/* Header */
.campaign-card-header {
    background-color: #f7f7f7; /* Fundo neutro e suave */
    border-bottom: 1px solid var(--smr-border);
    padding: 8px 14px;
    font-size: 0.85rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.campaign-id {
    color: var(--smr-orange); /* Destaque laranja para o ID */
    font-weight: 600;
    margin-right: 6px;
}

.campaign-name {
    font-weight: 600;
    color: var(--smr-text);
}

/* Links */
.campaign-card-saas .btn-link {
    padding-left: 0;
    text-decoration: none;
    color: var(--smr-orange); /* Links com a cor da marca */
    font-weight: 500;
}

.campaign-card-saas .btn-link:hover {
    text-decoration: underline;
}

/* =====================================================
   TABLE (DESKTOP ONLY USAGE)
===================================================== */

.table thead th {
    font-size: 0.7rem;
    text-transform: uppercase;
    color: var(--smr-muted);
}

.table tbody tr {
    transition: background-color 0.15s ease;
}

.table tbody tr:hover {
    background-color: rgba(255, 114, 46, 0.05); /* Fundo de hover laranja bem sutil */
}

/* =====================================================
   FOOTER
===================================================== */

.smr-footer {
    background-color: var(--smr-white);
    border-top: 1px solid var(--smr-border);
    padding: 12px 16px;
    margin-top: 40px;
    font-size: 0.75rem;
    color: var(--smr-muted);
}

.smr-footer .container,
.smr-footer .container-fluid {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-align: center;
}

/* =====================================================
   BREAKPOINTS (ENHANCEMENTS)
===================================================== */

/* ≥ 768px (Tablet) */
@media (min-width: 768px) {
    .smr-header .container,
    .smr-header .container-fluid {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .smr-nav {
        border-top: none;
        padding-top: 0;
    }

    .smr-content {
        margin-top: 24px;
    }

    .smr-footer .container,
    .smr-footer .container-fluid {
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
    }
}

/* ≥ 992px (Desktop) */
@media (min-width: 992px) {
    /* Não há mais necessidade de regras específicas de fonte aqui */
}

/* ===== PROOF LIST ===== */

.proof-row {
    border-radius: 12px;
}

.text-smr {
    color: var(--smr-orange); /* Classe de utilidade para texto laranja */
}

.smr-audio {
    height: 36px;
}

/* Audio custom clean */
.smr-audio::-webkit-media-controls-panel {
    background-color: #f7f7f7; /* Fundo neutro */
}

.smr-audio::-webkit-media-controls-play-button {
    filter: invert(0.3);
}

/* Mobile */
@media (max-width: 768px) {
    .proof-row .card-body {
        padding: 16px;
    }
}

/* DASHBOARD ADMIN */
.smr-dashboard-card {
    background: #fff;
    border: 1px solid var(--smr-border);
    border-radius: 14px;
    transition: all .2s ease;
}

.smr-dashboard-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.08);
}

.smr-card-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

/* =====================================================
   MOBILE NAV (HAMBURGER)
===================================================== */

.smr-nav-mobile {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px 20px;
    border-top: 1px solid var(--smr-border);
    background-color: var(--smr-white);
}

.smr-nav-mobile a {
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--smr-text);
}

.smr-nav-mobile a:hover {
    color: var(--smr-orange);
}

/* HEADER INNER */
.smr-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* MOBILE: mantém logo à esquerda e hamburger à direita */
@media (max-width: 768px) {
    .smr-header .container {
        flex-direction: row !important;
    }
}

.btn-link {
    text-decoration: none;
}

.btn-link:hover {
    text-decoration: underline;
}

/* Logo arredondada (login) */
.smr-login-logo-img {
    max-height: 60px;
    border-radius: 12px;
    object-fit: cover;
}

/* =========================
   SCROLL DO MODAL (FIX)
========================= */

.bulk-schedule-body {
    max-height: calc(100vh - 240px);
    overflow-y: auto;
}

.bulk-schedule-body::-webkit-scrollbar {
    width: 8px;
}

.bulk-schedule-body::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 6px;
}

.bulk-schedule-body::-webkit-scrollbar-track {
    background: transparent;
}