/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

/* Custom CSS for Nexus Theme
 *
 * This file allows you to customize the theme colors and styles for the entire Nexus template.
 *
 * To customize colors:
 * - Replace the var() references with your own hex colors or other CSS values.
 * - For example, instead of --primary: #4b5563; use --primary: #your-color;
 * - You can also override any CSS properties here.
 */

:root {
    --white: #fff;

    /* Neutral shades */
    --neutral-50: #fbf9fa;
    --neutral-100: #f4f5f7;
    --neutral-200: #e4e4e7;
    --neutral-300: #d0d5dd;
    --neutral-400: #9ca3af;
    --neutral-500: #6b7280;
    --neutral-600: #4b5563;
    --neutral-700: #374151;
    --neutral-800: #1f2937;
    --neutral-900: #111827;
    --neutral-950: #030712;

    /* Neutral shades */
    /* define own pallet with brand colors */
    --primary-50: var(--neutral-50);
    --primary-100: var(--neutral-100);
    --primary-200: var(--neutral-200);
    --primary-300: var(--neutral-300);
    --primary-400: var(--neutral-400);
    --primary-500: var(--neutral-500);
    --primary-600: var(--neutral-600);
    --primary-700: var(--neutral-700);
    --primary-800: var(--neutral-800);
    --primary-900: var(--neutral-900);
    --primary-950: var(--neutral-900);

    /* Primary colors */
    /* Use shades from comments if `primary` colors use other colors, then neutral */
    --primary: var(--neutral-900);          /* var(--primary-600) */
    --primary-lifted: var(--neutral-800);   /* var(--primary-700) */
    --primary-accented: var(--neutral-700); /* var(--primary-800) */

    /* Secondary colors */
    --secondary: var(--neutral-500);
    --secondary-lifted: var(--neutral-600);
    --secondary-accented: var(--neutral-700);

    /* Success colors */
    --success: #00a63e;
    --success-lifted: #008236;
    --success-accented: #016630;

    /* Info colors */
    --info: #155dfc;
    --info-lifted: #1447e6;
    --info-accented: #193cb8;

    /* Notice colors */
    --notice: #7f22fe;
    --notice-lifted: #7008e7;
    --notice-accented: #5d0ec0;

    /* Warning colors */
    --warning: #f54a00;
    --warning-lifted: #ca3500;
    --warning-accented: #9f2d00;

    /* Error colors */
    --error: #e7000b;
    --error-lifted: #c10007;
    --error-accented: #9f0712;

    /* Grayscale colors */
    --grayscale: var(--neutral-900);
    --grayscale-lifted: var(--neutral-800);
    --grayscale-accented: var(--neutral-700);

    /* Neutral colors */
    --neutral: var(--neutral-500);
    --neutral-lifted: var(--neutral-600);
    --neutral-accented: var(--neutral-700);

    /* Text neutral colors */
    --text-inverted: var(--white);
    --text-muted: var(--neutral-400);
    --text-lifted: var(--neutral-500);
    --text-accented: var(--neutral-600);
    --text: var(--neutral-900);

    /* Border neutral colors */
    --border-muted: var(--neutral-200);
    --border: var(--neutral-300);
    --border-lifted: var(--neutral-400);
    --border-accented: var(--neutral-600);

    /* Background neutral colors */
    --bg: var(--white);
    --bg-muted: var(--neutral-50);
    --bg-lifted: var(--neutral-100);
    --bg-accented: var(--neutral-200);
    --bg-inverted: var(--neutral-900);

    /* Additional colors */
    --yellow-200: #fff085;
    --yellow-300: #ffdf20;
    --teal-300: #46edd5;
    --teal-400: #00d5be;
    --emerald-300: #5ee9b5;
    --pink-400: #fb64b6;

    /* Additional custom properties */
    /* Font sizes */
    --text-xs: 0.625rem;
    --text-sm: 0.75rem;
    --text-md: 0.875rem;
    --text-lg: 1rem;

    /* Spacing */
    --outline-sm: 1px;
    --outline-md: 2px;
    --outline-lg: 3px;

    /* Rounding */
    --rounding-sm: 0.25rem;
    --rounding-md: 0.5rem;
    --rounding-lg: 0.75rem;

    /* Other */
    --letter-spacing: 0em;
    --disabled-opacity: 25%;
}
/* ===========================================================
 * Design Master — Brand Palette Override (Nexus)
 * Cor base: #3DB5E6 (azul logo DM)
 * =========================================================== */
:root {
    /* DM Brand Scale (sky-blue) */
    --dm-50:  #f0faff;
    --dm-100: #e0f4fe;
    --dm-200: #bae5fd;
    --dm-300: #7dd0fc;
    --dm-400: #3DB5E6; /* logo */
    --dm-500: #1e9bd1;
    --dm-600: #0e7eb1;
    --dm-700: #0c648f;
    --dm-800: #0e5476;
    --dm-900: #134662;
    --dm-950: #0c2c41;

    /* Map para os tokens primary do Nexus */
    --primary-50:  var(--dm-50);
    --primary-100: var(--dm-100);
    --primary-200: var(--dm-200);
    --primary-300: var(--dm-300);
    --primary-400: var(--dm-400);
    --primary-500: var(--dm-500);
    --primary-600: var(--dm-600);
    --primary-700: var(--dm-700);
    --primary-800: var(--dm-800);
    --primary-900: var(--dm-900);
    --primary-950: var(--dm-950);

    /* Sobrescreve os primary semânticos (estavam neutral-900) */
    --primary:           var(--dm-500);
    --primary-lifted:    var(--dm-600);
    --primary-accented:  var(--dm-700);
}

/* Botões primários — herdam os tokens, mas garantimos contraste */
.btn-primary,
.btn-primary:focus {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
}
.btn-primary:hover,
.btn-primary:active {
    background-color: var(--primary-lifted) !important;
    border-color: var(--primary-lifted) !important;
}

/* Links e foco */
a { color: var(--primary); }
a:hover { color: var(--primary-lifted); }

/* Header / navbar — tom escuro elegante */
.navbar { background-color: var(--dm-900) !important; }
.navbar a, .navbar .nav-link { color: var(--dm-100) !important; }
.navbar a:hover, .navbar .nav-link:hover { color: var(--dm-300) !important; }

/* Cards de produto/grupo na home */
.card-title { color: var(--dm-700); }

/* ===== fixes pós-inspeção ===== */

/* Body branco — não preto */
html, body { background-color: var(--bg) !important; color: var(--text); }

/* Header (faixa que envolve a navbar) — usar mesma cor da navbar */
header.header { background-color: var(--dm-900) !important; }
header.header .container { background-color: transparent !important; }

/* Garantir contraste em todos os links/textos do header+navbar */
header.header a,
header.header .nav-link,
header.header .navbar-brand,
header.header .navbar-nav .nav-link {
    color: var(--dm-100) !important;
}
header.header a:hover,
header.header .nav-link:hover {
    color: var(--white) !important;
}

/* Search box de KB no header (input branco com texto escuro mantém) */
header.header input.form-control { color: var(--text) !important; }

/* Botão Transferir (success) — sobrescrever o tom escuro padrão */
.btn-success,
.btn-success:focus {
    background-color: var(--success) !important;
    border-color: var(--success) !important;
    color: #fff !important;
}
.btn-success:hover,
.btn-success:active {
    background-color: var(--success-lifted) !important;
    border-color: var(--success-lifted) !important;
}

/* Outline na barra de busca de domínio */
.btn-recaptcha { color: #fff !important; }

/* btn-recaptcha sobrescreve success — força DM */
button.btn-recaptcha.btn-success,
.btn-recaptcha.btn-success {
    background-color: var(--success) !important;
    border-color: var(--success) !important;
    color: #fff !important;
}
button.btn-recaptcha.btn-primary,
.btn-recaptcha.btn-primary {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* override regras IDs do Nexus para btn Transferir/Search */
body #frmDomainHomepage #btnTransfer {
    background-color: var(--success) !important;
    border-color: var(--success) !important;
}
body #frmDomainHomepage #btnTransfer:hover {
    background-color: var(--success-lifted) !important;
}

/* ============================================
   Polimento do orderform premium_comparison
   ============================================ */

/* container geral */
#order-premium_comparison .price-table-container {
    padding-top: 20px;
}

/* equalizar e centralizar os cards (remove offset do .active) */
#order-premium_comparison .price-table-container ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 24px;
}
#order-premium_comparison .price-table-container ul li {
    background: none;
    padding: 0;
    display: flex;
    flex: 0 0 auto;
}
#order-premium_comparison .price-table-container .price-table {
    width: 260px;
    min-width: 260px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 16px rgba(15,40,60,0.08);
    border-radius: 10px;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}
#order-premium_comparison .price-table-container .price-table:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(15,40,60,0.18);
}
#order-premium_comparison .price-table-container .price-table.active {
    margin: 0;
    width: 280px;
    min-width: 280px;
    border: 2px solid var(--dm-400);
    box-shadow: 0 12px 28px rgba(61,181,230,0.28);
}

/* header dos cards: azul DM uniforme */
#order-premium_comparison .price-table-container .price-table .top-head {
    background: linear-gradient(180deg, var(--dm-700) 0%, var(--dm-900) 100%) !important;
    filter: none !important;
    border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0;
}
#order-premium_comparison .price-table-container .price-table.active .top-head {
    background: linear-gradient(180deg, var(--dm-400) 0%, var(--dm-700) 100%) !important;
}
#order-premium_comparison .price-table-container .price-table .top-head .top-area {
    border-bottom-color: rgba(255,255,255,0.18);
    padding: 18px 8px;
}
#order-premium_comparison .price-table-container .price-table .top-head .top-area h4 {
    font-size: 22px;
    font-weight: 600;
    color: #fff;
}
#order-premium_comparison .price-table-container .price-table .top-head .price-area {
    border-top-color: rgba(255,255,255,0.18);
    color: #fff;
    padding: 14px 0 18px;
}
#order-premium_comparison .price-table-container .price-table .top-head .price-area .price {
    padding: 6px 0 10px;
    color: #fff;
    font-size: 14px;
}
#order-premium_comparison .price-table-container .price-table .top-head .price-area .price span {
    font-size: 34px;
    font-weight: 700;
}

/* selo MAIS POPULAR — barra contrastante */
#order-premium_comparison .price-table-container .price-table .top-head .featured,
#order-premium_comparison .price-table.active .featured {
    background: #ffd84d !important;
    color: #0c2c41 !important;
    text-shadow: none !important;
    font-weight: 700;
    letter-spacing: 1px;
    font-size: 11px;
    padding: 6px 0;
    text-align: center;
    text-transform: uppercase;
}

/* botão "Faça seu pedido agora" */
#order-premium_comparison .price-table-container .order-button,
#order-premium_comparison .price-table-container .order-button:hover {
    background: var(--success) !important;
    border: none !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-weight: 600;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 14px 18px 18px;
    padding: 12px 0;
    transition: background .15s ease;
}
#order-premium_comparison .price-table-container .order-button:hover {
    background: var(--success-lifted, #00913a) !important;
}
#order-premium_comparison .price-table.active .order-button {
    background: var(--dm-500) !important;
}
#order-premium_comparison .price-table.active .order-button:hover {
    background: var(--dm-600) !important;
}

/* corpo do card */
#order-premium_comparison .price-table .price-info,
#order-premium_comparison .price-table > ul,
#order-premium_comparison .price-table .description,
#order-premium_comparison .price-table .body {
    flex: 1;
    background: #fff;
    color: #4a5568;
}
#order-premium_comparison .price-table p {
    color: #1a2a3a;
    padding: 18px 18px 8px;
    margin: 0;
    text-align: center;
    font-weight: 500;
}
#order-premium_comparison .price-table ul li {
    background: none;
    padding: 12px 16px;
    border-bottom: 1px solid #eef2f6;
    text-align: center;
    font-size: 13.5px;
    line-height: 1.5;
    color: #4a5568;
    display: block;
    width: 100%;
}
#order-premium_comparison .price-table ul li:last-child {
    border-bottom: none;
}

/* responsivo */
@media (max-width: 992px) {
    #order-premium_comparison .price-table-container ul {
        gap: 16px;
    }
    #order-premium_comparison .price-table-container .price-table,
    #order-premium_comparison .price-table-container .price-table.active {
        width: 100%;
        max-width: 320px;
        min-width: auto;
    }
}

/* ============================================
   Polimento do orderform premium_comparison
   ============================================ */

/* container geral */
#order-premium_comparison .price-table-container {
    padding-top: 20px;
}

/* equalizar e centralizar os cards (remove offset do .active) */
#order-premium_comparison .price-table-container ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 24px;
}
#order-premium_comparison .price-table-container ul li {
    background: none;
    padding: 0;
    display: flex;
    flex: 0 0 auto;
}
#order-premium_comparison .price-table-container .price-table {
    width: 260px;
    min-width: 260px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 16px rgba(15,40,60,0.08);
    border-radius: 10px;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}
#order-premium_comparison .price-table-container .price-table:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(15,40,60,0.18);
}
#order-premium_comparison .price-table-container .price-table.active {
    margin: 0;
    width: 280px;
    min-width: 280px;
    border: 2px solid var(--dm-400);
    box-shadow: 0 12px 28px rgba(61,181,230,0.28);
}

/* header dos cards: azul DM uniforme */
#order-premium_comparison .price-table-container .price-table .top-head {
    background: linear-gradient(180deg, var(--dm-700) 0%, var(--dm-900) 100%) !important;
    filter: none !important;
    border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0;
}
#order-premium_comparison .price-table-container .price-table.active .top-head {
    background: linear-gradient(180deg, var(--dm-400) 0%, var(--dm-700) 100%) !important;
}
#order-premium_comparison .price-table-container .price-table .top-head .top-area {
    border-bottom-color: rgba(255,255,255,0.18);
    padding: 18px 8px;
}
#order-premium_comparison .price-table-container .price-table .top-head .top-area h4 {
    font-size: 22px;
    font-weight: 600;
    color: #fff;
}
#order-premium_comparison .price-table-container .price-table .top-head .price-area {
    border-top-color: rgba(255,255,255,0.18);
    color: #fff;
    padding: 14px 0 18px;
}
#order-premium_comparison .price-table-container .price-table .top-head .price-area .price {
    padding: 6px 0 10px;
    color: #fff;
    font-size: 14px;
}
#order-premium_comparison .price-table-container .price-table .top-head .price-area .price span {
    font-size: 34px;
    font-weight: 700;
}

/* selo MAIS POPULAR — barra contrastante */
#order-premium_comparison .price-table-container .price-table .top-head .featured,
#order-premium_comparison .price-table.active .featured {
    background: #ffd84d !important;
    color: #0c2c41 !important;
    text-shadow: none !important;
    font-weight: 700;
    letter-spacing: 1px;
    font-size: 11px;
    padding: 6px 0;
    text-align: center;
    text-transform: uppercase;
}

/* botão "Faça seu pedido agora" */
#order-premium_comparison .price-table-container .order-button,
#order-premium_comparison .price-table-container .order-button:hover {
    background: var(--success) !important;
    border: none !important;
    border-radius: 6px !important;
    color: #fff !important;
    font-weight: 600;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 14px 18px 18px;
    padding: 12px 0;
    transition: background .15s ease;
}
#order-premium_comparison .price-table-container .order-button:hover {
    background: var(--success-lifted, #00913a) !important;
}
#order-premium_comparison .price-table.active .order-button {
    background: var(--dm-500) !important;
}
#order-premium_comparison .price-table.active .order-button:hover {
    background: var(--dm-600) !important;
}

/* corpo do card */
#order-premium_comparison .price-table .price-info,
#order-premium_comparison .price-table > ul,
#order-premium_comparison .price-table .description,
#order-premium_comparison .price-table .body {
    flex: 1;
    background: #fff;
    color: #4a5568;
}
#order-premium_comparison .price-table p {
    color: #1a2a3a;
    padding: 18px 18px 8px;
    margin: 0;
    text-align: center;
    font-weight: 500;
}
#order-premium_comparison .price-table ul li {
    background: none;
    padding: 12px 16px;
    border-bottom: 1px solid #eef2f6;
    text-align: center;
    font-size: 13.5px;
    line-height: 1.5;
    color: #4a5568;
    display: block;
    width: 100%;
}
#order-premium_comparison .price-table ul li:last-child {
    border-bottom: none;
}

/* responsivo */
@media (max-width: 992px) {
    #order-premium_comparison .price-table-container ul {
        gap: 16px;
    }
    #order-premium_comparison .price-table-container .price-table,
    #order-premium_comparison .price-table-container .price-table.active {
        width: 100%;
        max-width: 320px;
        min-width: auto;
    }
}

/* ============================================
   Correção: classes reais do template premium_comparison
   (.popular-plan ao invés de .featured/.active)
   ============================================ */

/* destacar card que contém .popular-plan */
#order-premium_comparison .price-table-container .price-table:has(.popular-plan) {
    width: 290px !important;
    min-width: 290px !important;
    border: 2px solid var(--dm-400) !important;
    box-shadow: 0 12px 28px rgba(61,181,230,0.28) !important;
    transform: translateY(-8px);
}
#order-premium_comparison .price-table-container .price-table:has(.popular-plan) .top-head {
    background: linear-gradient(180deg, var(--dm-400) 0%, var(--dm-700) 100%) !important;
}
#order-premium_comparison .price-table-container .price-table:has(.popular-plan) .order-button,
#order-premium_comparison .price-table-container .price-table:has(.popular-plan) .order-button:hover {
    background: var(--dm-500) !important;
}
#order-premium_comparison .price-table-container .price-table:has(.popular-plan) .order-button:hover {
    background: var(--dm-600) !important;
}

/* selo MAIS POPULAR */
#order-premium_comparison .popular-plan {
    background: #ffd84d !important;
    color: #0c2c41 !important;
    text-shadow: none !important;
    font-weight: 700 !important;
    letter-spacing: 1px;
    font-size: 11px;
    padding: 6px 0;
    text-align: center;
    text-transform: uppercase;
    margin: 0 !important;
}

/* aumentar especificidade pra width 260px nos não-active */
#order-premium_comparison .price-table-container ul li .price-table {
    width: 260px !important;
    min-width: 260px !important;
}
#order-premium_comparison .price-table-container ul li .price-table:has(.popular-plan) {
    width: 290px !important;
    min-width: 290px !important;
}

/* === Dropdown submenus (Conta, Loja, etc) === */
.dropdown-menu,
.navbar .dropdown-menu,
header .dropdown-menu {
  background-color: #ffffff !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
  padding: 8px 0 !important;
  border-radius: 8px !important;
}

.dropdown-menu .dropdown-item,
.navbar .dropdown-menu a,
header .dropdown-menu a {
  color: #1a2434 !important;
  opacity: 1 !important;
  font-weight: 500 !important;
  padding: 10px 20px !important;
  background: transparent !important;
}

.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.navbar .dropdown-menu a:hover,
header .dropdown-menu a:hover {
  background-color: var(--dm-50, #e6f4fb) !important;
  color: var(--dm-700, #1a8fc7) !important;
}

.dropdown-menu .dropdown-item.disabled,
.dropdown-menu .dropdown-item:disabled {
  color: #94a3b8 !important;
  opacity: .6 !important;
}

.dropdown-divider {
  border-top-color: rgba(0,0,0,0.08) !important;
}

/* === DesignMaster brand colors override === */
:root{
  --dm-primary:#098CC0;
  --dm-primary-hover:#0779a8;
  --dm-dark:#182130;
}
a, a:link{ color:#098CC0; }
a:hover, a:focus{ color:#0779a8; }
.btn-primary, .btn-info{
  background:#098CC0 !important; border-color:#098CC0 !important; color:#fff !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-info:hover, .btn-info:focus{
  background:#0779a8 !important; border-color:#0779a8 !important;
}
.btn-outline-primary{ color:#098CC0 !important; border-color:#098CC0 !important; }
.btn-outline-primary:hover{ background:#098CC0 !important; color:#fff !important; }
.text-primary{ color:#098CC0 !important; }
.bg-primary{ background-color:#098CC0 !important; }
.alert-info{ background:#e6f4fa; border-color:#098CC0; color:#0a3a4f; }
.badge-primary, .badge-info{ background:#098CC0 !important; }
.progress-bar{ background:#098CC0 !important; }

/* dark — header / footer / navs */
.header, .navbar-default, header.header,
footer, footer.footer, .footer,
.main-header-section, .panel-heading, .nav-pills .nav-link.active{
  background:#182130 !important; color:#fff !important;
}
.header a, .navbar-default .navbar-nav > li > a, footer a{ color:#cfd6e0 !important; }
.header a:hover, footer a:hover{ color:#fff !important; }

/* sidebar / cards-de-destaque */
.sidebar .panel-heading, .sidebar .list-group-item.active{
  background:#182130 !important; border-color:#182130 !important; color:#fff !important;
}

/* form focus */
.form-control:focus{
  border-color:#098CC0 !important;
  box-shadow:0 0 0 .2rem rgba(9,140,192,.25) !important;
}

/* ============================================================
   DM Brand 2026 — alinhamento com www.designmaster.com.br
   (deve vir por último para sobrescrever as definições anteriores)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Geist:wght@400;500;600;700;800&display=swap');

:root {
    /* Paleta DM 2026 (igual ao site institucional) */
    --dm-50:  #f0faff;
    --dm-100: #e0f4fe;
    --dm-200: #bae5fd;
    --dm-300: #7dd0fc;
    --dm-400: #54bcf8;   /* primary do site */
    --dm-500: #2aa5ec;
    --dm-600: #0084B6;   /* primary-dark */
    --dm-700: #006a92;   /* primary-darker */
    --dm-800: #0e5476;
    --dm-900: #0a1525;   /* bg-dark */
    --dm-950: #060e1a;

    --primary-50:  var(--dm-50);
    --primary-100: var(--dm-100);
    --primary-200: var(--dm-200);
    --primary-300: var(--dm-300);
    --primary-400: var(--dm-400);
    --primary-500: var(--dm-500);
    --primary-600: var(--dm-600);
    --primary-700: var(--dm-700);
    --primary-800: var(--dm-800);
    --primary-900: var(--dm-900);
    --primary-950: var(--dm-950);

    --primary:           var(--dm-600);
    --primary-lifted:    var(--dm-500);
    --primary-accented:  var(--dm-700);

    /* Tipografia */
    --font-display: 'Geist', 'Inter', system-ui, -apple-system, sans-serif;
    --font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

    /* Roundness um pouco maior (vibe do site) */
    --rounding-sm: 0.375rem;
    --rounding-md: 0.625rem;
    --rounding-lg: 1rem;
}

/* Aplicar tipografia em todo o WHMCS */
html, body {
    font-family: var(--font-body) !important;
    font-feature-settings: 'cv11', 'ss01';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.card-title, .panel-title,
.navbar-brand,
.section-title, .page-title {
    font-family: var(--font-display) !important;
    font-weight: 600;
    letter-spacing: -.025em;
}
h1, .h1, .page-title { letter-spacing: -.035em; font-weight: 600; }
h2, .h2 { letter-spacing: -.03em; }

/* Botões — botão primary com gradiente DM */
.btn-primary,
.btn-primary:focus,
button.btn-primary {
    background: linear-gradient(135deg, var(--dm-400) 0%, var(--dm-600) 100%) !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600;
    box-shadow: 0 4px 14px rgba(0,132,182,.28);
    transition: transform .15s ease, box-shadow .2s ease;
}
.btn-primary:hover,
.btn-primary:active,
button.btn-primary:hover {
    background: linear-gradient(135deg, var(--dm-500) 0%, var(--dm-700) 100%) !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(0,132,182,.45);
}

/* Header navbar — fundo navy igual ao header do site */
header.header,
.navbar.navbar-main,
.navbar {
    background-color: var(--dm-900) !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

/* Cards com bordas suaves e shadow leve (estilo site) */
.card, .panel {
    border-radius: var(--rounding-lg) !important;
    border-color: var(--border-muted) !important;
    box-shadow: 0 1px 2px rgba(11,18,32,.04), 0 4px 12px rgba(11,18,32,.04);
}

/* Inputs com tom DM no foco */
.form-control:focus, input:focus, select:focus, textarea:focus {
    border-color: var(--dm-400) !important;
    box-shadow: 0 0 0 3px rgba(84,188,248,.18) !important;
}

/* Links de KB e do footer */
a, a:visited { color: var(--dm-600); }
a:hover { color: var(--dm-700); }

/* Footer mais clean */
footer.footer {
    background: var(--dm-900) !important;
    color: rgba(255,255,255,.7);
}
footer.footer a { color: rgba(255,255,255,.85); }
footer.footer a:hover { color: var(--dm-300); }

/* Selection & focus visible */
::selection { background: var(--dm-400); color: #fff; }
:focus-visible { outline: 2px solid var(--dm-400) !important; outline-offset: 3px !important; }

/* Force light mode (impede Safari auto-dark) */
:root { color-scheme: light; }
html, body { color-scheme: light; }

/* logo-img mobile sizing */
@media (max-width: 768px) {
  .navbar-brand { padding: 8px 12px !important; }
  .navbar-brand .logo-img { max-height: 36px !important; height: 36px !important; width: auto !important; }
}
@media (max-width: 480px) {
  .navbar-brand .logo-img { max-height: 30px !important; height: 30px !important; }
}

/* === Loja: cards de produto legíveis === */
.product, .panel.card, .panel.card.panel-default,
.panel.card .panel-body, .panel.card .card-body,
.product-desc, .product-pricing, .product-features,
.product .panel-heading, .product .card-header{
  background:#fff !important;
  color:#1a2b3c !important;
}
.product *, .panel.card *{ color:inherit !important; }
.product .panel-heading, .product .card-header,
.product h1, .product h2, .product h3, .product h4, .product h5{
  color:#182130 !important;
}
.product .product-pricing, .product .price, .product .product-pricing strong{
  color:#098CC0 !important;
}
.product ul, .product ul li, .product-desc ul li, .product-features li{
  color:#3a4a5c !important;
}
.product hr{ border-color:#e6ecf2 !important; }
.product .btn-success, .btn-success{
  background:#098CC0 !important; border-color:#098CC0 !important; color:#fff !important;
}
.product .btn-success:hover{ background:#0779a8 !important; border-color:#0779a8 !important; }

/* sidebar/categorias da loja */
.panel-sidebar .list-group-item.active,
.panel-sidebar .list-group-item-action.active{
  background:#098CC0 !important; border-color:#098CC0 !important; color:#fff !important;
}
.panel-sidebar .list-group-item{ color:#1a2b3c !important; }
.panel-sidebar .panel-heading, .panel-sidebar .card-header{
  background:#182130 !important; color:#fff !important;
}

/* === Loja: cards de produto legíveis === */
.product, .panel.card, .panel.card.panel-default,
.panel.card .panel-body, .panel.card .card-body,
.product-desc, .product-pricing, .product-features,
.product .panel-heading, .product .card-header{
  background:#fff !important;
  color:#1a2b3c !important;
}
.product *, .panel.card *{ color:inherit !important; }
.product .panel-heading, .product .card-header,
.product h1, .product h2, .product h3, .product h4, .product h5{
  color:#182130 !important;
}
.product .product-pricing, .product .price, .product .product-pricing strong{
  color:#098CC0 !important;
}
.product ul, .product ul li, .product-desc ul li, .product-features li{
  color:#3a4a5c !important;
}
.product hr{ border-color:#e6ecf2 !important; }
.product .btn-success, .btn-success{
  background:#098CC0 !important; border-color:#098CC0 !important; color:#fff !important;
}
.product .btn-success:hover{ background:#0779a8 !important; border-color:#0779a8 !important; }

/* sidebar/categorias da loja */
.panel-sidebar .list-group-item.active,
.panel-sidebar .list-group-item-action.active{
  background:#098CC0 !important; border-color:#098CC0 !important; color:#fff !important;
}
.panel-sidebar .list-group-item{ color:#1a2b3c !important; }
.panel-sidebar .panel-heading, .panel-sidebar .card-header{
  background:#182130 !important; color:#fff !important;
}

/* responsive polish 2026-05-04 */

/* Cards de produto: contraste do texto descritivo (sem mexer no fundo) */
.product .product-desc { color: #475569 !important; }
.product .product-desc p,
.product .product-desc li { color: #475569 !important; }
.product .product-desc strong,
.product .product-desc h1, .product .product-desc h2,
.product .product-desc h3, .product .product-desc h4 { color: #0f172a !important; }

/* Footer do site: dar respiro aos links */
footer.footer .nav .nav-item .nav-link { padding: .55rem .9rem !important; }
footer.footer .nav { gap: .25rem; flex-wrap: wrap; justify-content: center !important; }

/* Mobile: ajustes finos */
@media (max-width: 768px) {
  /* Cards com mais respiro */
  .product { margin-bottom: 1rem !important; }
  /* Hero search button row */
  .home-shortcuts { padding: 1rem .75rem !important; }
  /* Container padding mobile */
  .main-content > .container,
  #main-body > .container { padding-left: 1rem !important; padding-right: 1rem !important; }
  /* Headlines não estourar */
  h1, h2 { word-wrap: break-word; overflow-wrap: break-word; }
  /* Pricing destacado */
  .product .product-pricing .price { font-size: 1.6rem !important; }
}

@media (max-width: 480px) {
  h1 { font-size: 1.6rem !important; }
  h2 { font-size: 1.35rem !important; }
  .navbar-brand .logo-img { max-height: 28px !important; height: 28px !important; }
}


/* product card footer light — substitui o navy escuro padrão do nexus */
.product > footer,
.product .product-pricing {
  background: #f8fafc !important;
  color: #0f172a !important;
  border-top: 1px solid #e5e7eb !important;
}
.product > footer * { color: inherit !important; }
.product .product-pricing .price { color: #0f172a !important; font-weight: 600 !important; }
.product > footer .btn-primary,
.product .product-pricing .btn-primary {
  background: linear-gradient(135deg, var(--dm-400) 0%, var(--dm-600) 100%) !important;
  color: #fff !important; border: none !important;
}

/* list-group small text fix — descrição abaixo do título de itens (downloads, KB, etc) */
.list-group .list-group-item small,
.list-group .list-group-item .small,
.kb-article-item small {
  color: #475569 !important;
  opacity: 1 !important;
}

/* header search input alignment 2026-05-04 */
.input-group.search .form-control.appended-form-control { border-radius: 0 6px 6px 0 !important; }
.input-group.search .input-group-prepend .btn { border-radius: 6px 0 0 6px !important; }

/* mobile header layout 2026-05-04 */
@media (max-width: 1199.98px) {
  .navbar > .container { display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; }
  .navbar .navbar-brand { margin-right: auto; margin-left: 0; }
  .navbar .navbar-nav.toolbar { margin-left: auto; flex-direction: row; align-items: center; }
  .navbar .navbar-nav.toolbar .nav-item { margin-left: .25rem; }
  .navbar .navbar-toggler { margin-left: .5rem; }
}

/* ============================================================
   DM 2026 — Client Area Home (dashboard)
   ============================================================ */

/* tiles container: gap, no negative gutters */
.tiles { margin-bottom: 1.5rem !important; }
.tiles > .row { row-gap: 1rem; column-gap: 1rem; margin: 0 !important; }
.tiles > .row > [class*="col-"] { padding: 0 !important; flex: 1 1 calc(25% - .75rem); max-width: calc(25% - .75rem); }
@media (max-width: 991.98px) {
  .tiles > .row > [class*="col-"] { flex: 1 1 calc(50% - .5rem); max-width: calc(50% - .5rem); }
}
@media (max-width: 575.98px) {
  .tiles > .row > [class*="col-"] { flex: 1 1 100%; max-width: 100%; }
}

/* Tile card */
.tiles .tile {
  display: block;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1.25rem 1.25rem 1rem;
  text-align: left;
  position: relative;
  text-decoration: none !important;
  color: var(--dm-900, #0a1525) !important;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  overflow: hidden;
  min-height: 120px;
}
.tiles .tile:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(0,80,128,0.10);
  border-color: var(--dm-300, #8ad2f9);
}
.tiles .tile > i:first-child {
  font-size: 1.5rem;
  color: var(--dm-600, #0084B6);
  margin-bottom: .75rem;
  display: block;
  opacity: .9;
}
.tiles .tile .stat {
  font-family: 'Geist', system-ui, sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  color: var(--dm-900, #0a1525);
  margin-bottom: .25rem;
}
.tiles .tile .title {
  font-size: .8125rem;
  font-weight: 500;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .03em;
}
/* hide the legacy bottom highlight bar — using border + shadow instead */
.tiles .tile .highlight { display: none !important; }

/* Color accents on the icon per category */
.tiles .col-6:nth-child(1) .tile > i { color: var(--dm-600, #0084B6); }
.tiles .col-6:nth-child(2) .tile > i { color: #16a34a; }
.tiles .col-6:nth-child(3) .tile > i { color: #ef4444; }
.tiles .col-6:nth-child(4) .tile > i { color: #f59e0b; }

/* ----- Client home panel cards ----- */
.client-home-cards .card {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03);
  overflow: hidden;
  margin-bottom: 1.25rem;
  background: #fff;
}
.client-home-cards .card .card-header {
  background: linear-gradient(180deg, #fafbfc 0%, #f1f5f9 100%);
  border-bottom: 1px solid #e2e8f0;
  padding: .9rem 1.1rem;
}
.client-home-cards .card .card-header .card-title {
  font-family: 'Geist', system-ui, sans-serif;
  font-size: .95rem;
  font-weight: 600;
  color: var(--dm-900, #0a1525) !important;
  letter-spacing: -0.01em;
}
.client-home-cards .card .card-header .card-title i { color: var(--dm-600, #0084B6); }
.client-home-cards .card .card-body { padding: 1.1rem; color: #1e293b; }
.client-home-cards .card .card-footer {
  background: #fafbfc;
  border-top: 1px solid #e2e8f0;
  padding: .65rem 1.1rem;
  font-size: .8125rem;
  color: #64748b;
}
.client-home-cards .card .card-footer:empty { display: none; }
/* remove o accent bar lateral colorido legado */
.client-home-cards .card[class*="card-accent-"] { border-top: none !important; }

/* List groups inside cards */
.client-home-cards .card .list-group { border-radius: 0; }
.client-home-cards .card .list-group .list-group-item {
  border-left: none;
  border-right: none;
  padding: .75rem 1.1rem;
  color: #1e293b;
  font-size: .9rem;
  transition: background .12s ease;
}
.client-home-cards .card .list-group .list-group-item:first-child { border-top: none; }
.client-home-cards .card .list-group .list-group-item:last-child { border-bottom: none; }
.client-home-cards .card .list-group .list-group-item-action:hover {
  background: var(--dm-50, #f0faff) !important;
  color: var(--dm-700, #006a99) !important;
}
.client-home-cards .card .list-group .list-group-item i { color: var(--dm-600, #0084B6); margin-right: .35rem; }
.client-home-cards .card .list-group .list-group-item .badge {
  background: var(--dm-50, #f0faff);
  color: var(--dm-700, #006a99);
  font-weight: 600;
  border-radius: 999px;
  padding: .25em .6em;
}

/* Header buttons inside card-title (btn-link/btn-text) */
.client-home-cards .card .card-header .btn[class*="bg-color-"] {
  background: var(--dm-600, #0084B6) !important;
  border: none !important;
  color: #fff !important;
  padding: .35rem .75rem;
  font-size: .75rem;
  font-weight: 600;
  border-radius: 8px;
  text-transform: none;
  letter-spacing: 0;
}
.client-home-cards .card .card-header .btn[class*="bg-color-"]:hover {
  background: var(--dm-700, #006a99) !important;
}

/* small spacing on the page wrapper above tiles */
#main-body { padding-top: 1.5rem; }

/* ============================================================
   DM 2026 — Homepage do portal
   ============================================================ */

.dm-hero {
  background: linear-gradient(135deg, var(--dm-900, #0a1525) 0%, var(--dm-700, #006a99) 100%);
  color: #fff;
  padding: 4rem 1rem 3.5rem;
  margin: -2rem -15px 3rem;
  border-radius: 0;
  position: relative;
  overflow: hidden;
}
.dm-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 20% 30%, rgba(84,188,248,.18) 0%, transparent 50%),
                    radial-gradient(circle at 80% 70%, rgba(0,132,182,.20) 0%, transparent 55%);
  pointer-events: none;
}
.dm-hero > .container { position: relative; z-index: 1; max-width: 760px; }
.dm-hero-title {
  font-family: 'Geist', system-ui, sans-serif;
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0 0 1rem;
  color: #fff;
}
.dm-hero-title span { color: var(--dm-300, #8ad2f9); }
.dm-hero-sub {
  font-size: clamp(.95rem, 1.5vw, 1.125rem);
  color: rgba(255,255,255,.78);
  margin: 0 auto 2rem;
  max-width: 580px;
  line-height: 1.55;
}
.dm-hero-search {
  display: flex;
  gap: .5rem;
  max-width: 520px;
  margin: 0 auto;
  background: rgba(255,255,255,.08);
  padding: .35rem;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(8px);
}
.dm-hero-input {
  flex: 1;
  background: #fff;
  border: none;
  border-radius: 10px;
  padding: .75rem 1rem;
  font-size: .95rem;
  color: var(--dm-900, #0a1525);
}
.dm-hero-input:focus { outline: 2px solid var(--dm-300, #8ad2f9); outline-offset: 0; }
.dm-hero-btn {
  background: linear-gradient(135deg, var(--dm-400, #54bcf8) 0%, var(--dm-600, #0084B6) 100%);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: .75rem 1.5rem;
  font-weight: 600;
  font-size: .95rem;
  cursor: pointer;
  transition: filter .15s ease, transform .15s ease;
}
.dm-hero-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* Section title */
.dm-section-title {
  font-family: 'Geist', system-ui, sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--dm-900, #0a1525);
  margin: 3rem 0 1.5rem !important;
}

/* Product cards (grupos) */
.dm-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.25rem;
  margin-bottom: 3rem;
}
.dm-product-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 1.75rem 1.5rem;
  text-align: left;
  text-decoration: none !important;
  color: var(--dm-900, #0a1525) !important;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  min-height: 200px;
}
.dm-product-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 40px rgba(0,80,128,0.12);
  border-color: var(--dm-300, #8ad2f9);
}
.dm-product-card-icon {
  width: 48px; height: 48px;
  background: var(--dm-50, #f0faff);
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem;
  color: var(--dm-600, #0084B6);
  margin-bottom: 1rem;
}
.dm-product-card-title {
  font-family: 'Geist', system-ui, sans-serif;
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0 0 .5rem;
  color: var(--dm-900, #0a1525);
}
.dm-product-card-desc {
  font-size: .9rem;
  color: #475569;
  line-height: 1.5;
  margin-bottom: 1rem;
  flex: 1;
}
.dm-product-card-cta {
  font-size: .85rem;
  font-weight: 600;
  color: var(--dm-600, #0084B6);
}

/* Action grid (Como podemos ajudar / Sua conta) */
.dm-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1rem;
  margin-bottom: 3rem;
}
.dm-action-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1.5rem 1rem;
  text-decoration: none !important;
  color: var(--dm-900, #0a1525) !important;
  text-align: center;
  font-weight: 500;
  font-size: .9rem;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  min-height: 110px;
}
.dm-action-card i {
  font-size: 1.65rem;
  color: var(--dm-600, #0084B6);
}
.dm-action-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(0,80,128,0.10);
  border-color: var(--dm-300, #8ad2f9);
}
.dm-action-card-dark {
  background: linear-gradient(180deg, #0a1525 0%, #11253b 100%);
  border-color: transparent;
  color: #fff !important;
}
.dm-action-card-dark i { color: var(--dm-300, #8ad2f9); }
.dm-action-card-dark:hover { background: linear-gradient(180deg, #11253b 0%, #0a1525 100%); }

/* Esconde domain checker duplicado acima do hero (vem do homepagepanel) */
#main-body > .domain-checker, #main-body > .row > .col-md-6.text-center > h2:first-child + .domain-checker, body .container .row .col-12 .domain-checker { display: none !important; }
/* Mais robusto: esconde qualquer .domain-checker antes do hero */
.dm-hero ~ * .domain-checker { display: block !important; }
section.dm-hero { margin-top: 0 !important; }
#main-body > h2.text-center:first-child, .body-wrapper > h2.text-center:first-child { display: none; }
/* Esconder o block 'Proteja seu nome de dominio' acima do hero */
.body-wrapper > div > h2:first-child + form,
.body-wrapper > div > h2:first-child { display: none; }

/* Ocultar form de busca de domínio acima do hero (homepagepanel duplicado) */
#frmDomainHomepage { display: none !important; }

/* ============================================================
   DM 2026 — View Invoice
   ============================================================ */

/* invoice page wrapper */
.body-wrapper #order-summary,
.body-wrapper .invoice-container { background: #fff; border-radius: 16px; padding: 2rem; box-shadow: 0 1px 2px rgba(0,0,0,0.04); border: 1px solid #e2e8f0; }

/* Status badge — top of invoice */
.invoice-status,
.label-paid, .label-unpaid, .label-overdue, .label-cancelled, .label-refunded, .label-collections, .label-draft {
  display: inline-block;
  padding: .35rem .85rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: .8125rem;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.label-paid, .invoice-status.paid { background: #d1fae5 !important; color: #065f46 !important; }
.label-unpaid, .invoice-status.unpaid { background: #fef3c7 !important; color: #92400e !important; }
.label-overdue, .invoice-status.overdue { background: #fee2e2 !important; color: #991b1b !important; }
.label-cancelled, .invoice-status.cancelled, .label-refunded, .invoice-status.refunded { background: #f1f5f9 !important; color: #475569 !important; }
.label-collections, .invoice-status.collections { background: #fed7aa !important; color: #9a3412 !important; }
.label-draft, .invoice-status.draft { background: #e0e7ff !important; color: #3730a3 !important; }

/* Invoice header */
.invoice-header,
h1.invoice-title { font-family: 'Geist', system-ui, sans-serif; font-weight: 700; letter-spacing: -.015em; color: var(--dm-900, #0a1525); }

/* Tables in invoice */
.invoice-container table,
.body-wrapper .table.invoice-items,
.body-wrapper #invoiceitems {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.body-wrapper #invoiceitems thead th,
.body-wrapper .invoice-items thead th {
  background: #f8fafc !important;
  color: #475569 !important;
  font-weight: 600;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: .9rem 1rem;
  border-bottom: 1px solid #e2e8f0;
  border-top: none;
}
.body-wrapper #invoiceitems tbody td,
.body-wrapper .invoice-items tbody td {
  padding: 1rem;
  border-bottom: 1px solid #f1f5f9;
  border-top: none;
  color: #1e293b;
  vertical-align: middle;
}
.body-wrapper #invoiceitems tbody tr:last-child td,
.body-wrapper .invoice-items tbody tr:last-child td { border-bottom: none; }

/* Total/Balance area */
.body-wrapper .invoice-totals,
.body-wrapper .invoice-summary {
  background: #f8fafc;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.5rem;
}
.body-wrapper .invoice-totals .total-row,
.body-wrapper .invoice-totals .balance-due {
  font-family: 'Geist', system-ui, sans-serif;
  font-weight: 700;
  color: var(--dm-900, #0a1525);
  font-size: 1.125rem;
}

/* Pay button */
#paymentbutton, button[name="paywithcredit"], .paymentButton, .btn-pay-invoice {
  background: linear-gradient(135deg, var(--dm-400, #54bcf8) 0%, var(--dm-600, #0084B6) 100%) !important;
  border: none !important;
  color: #fff !important;
  padding: .9rem 1.75rem !important;
  font-weight: 600;
  font-size: 1rem;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0,132,182,0.25);
  transition: filter .15s ease, transform .15s ease;
}
#paymentbutton:hover, button[name="paywithcredit"]:hover, .paymentButton:hover, .btn-pay-invoice:hover {
  filter: brightness(1.08); transform: translateY(-1px);
  color: #fff !important;
}

/* Payment method selector cards */
.body-wrapper .gateway-options .gateway-option,
.body-wrapper .payment-methods .payment-method {
  border: 2px solid #e2e8f0;
  border-radius: 12px;
  padding: 1rem;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.body-wrapper .gateway-options .gateway-option:hover,
.body-wrapper .payment-methods .payment-method:hover { border-color: var(--dm-400, #54bcf8); background: var(--dm-50, #f0faff); }
.body-wrapper .gateway-options .gateway-option.selected,
.body-wrapper .payment-methods .payment-method.selected { border-color: var(--dm-600, #0084B6); background: var(--dm-50, #f0faff); }

/* Invoice meta info (data, vencimento, etc) */
.body-wrapper .invoice-meta dl, .body-wrapper .invoice-info {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .35rem 1rem;
  font-size: .9rem;
}
.body-wrapper .invoice-meta dt { color: #64748b; font-weight: 500; }
.body-wrapper .invoice-meta dd { color: #1e293b; font-weight: 600; margin: 0; }

/* Invoice summary card on right */
.invoice-container .invoice-summary { background: linear-gradient(135deg, var(--dm-50, #f0faff) 0%, #fff 100%); border: 1px solid var(--dm-200, #b9e3fa); }

/* PDF/Print buttons */
a[href*="dlpdfinvoice"], a[href*="invoice.php?action=print"], .btn-pdf, .btn-print {
  background: #fff !important;
  color: var(--dm-700, #006a99) !important;
  border: 1px solid var(--dm-200, #b9e3fa) !important;
  padding: .55rem 1rem;
  border-radius: 8px;
  font-weight: 500;
  font-size: .875rem;
}
a[href*="dlpdfinvoice"]:hover, a[href*="invoice.php?action=print"]:hover { background: var(--dm-50, #f0faff) !important; border-color: var(--dm-400, #54bcf8) !important; }

/* ============================================================
   DM 2026 — Support Tickets (view + submit)
   ============================================================ */

/* Submit ticket form */
.body-wrapper .ticket-submit-form,
form#frmTicketSubmit,
form[action*="submitticket"] {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  padding: 2rem;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

/* Department selector cards (steponec) */
.department-list .department,
.body-wrapper .department-card {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  margin-bottom: .75rem;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
  cursor: pointer;
}
.department-list .department:hover {
  border-color: var(--dm-400, #54bcf8);
  background: var(--dm-50, #f0faff);
  transform: translateY(-1px);
}
.department-list .department h4,
.department-list .department h5 {
  font-family: 'Geist', system-ui, sans-serif;
  font-weight: 600;
  color: var(--dm-900, #0a1525);
  margin: 0 0 .25rem;
}

/* Form fields inside ticket submit */
form[action*="submitticket"] .form-control,
form#frmTicketSubmit .form-control,
.body-wrapper .ticket-submit-form .form-control {
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  padding: .65rem .9rem;
  font-size: .95rem;
  transition: border-color .15s ease, box-shadow .15s ease;
}
form[action*="submitticket"] .form-control:focus,
form#frmTicketSubmit .form-control:focus,
.body-wrapper .ticket-submit-form .form-control:focus {
  border-color: var(--dm-400, #54bcf8);
  box-shadow: 0 0 0 3px rgba(84,188,248,.18);
  outline: none;
}
form[action*="submitticket"] label,
form#frmTicketSubmit label {
  font-weight: 500;
  color: #334155;
  font-size: .875rem;
  margin-bottom: .35rem;
}

/* View ticket — header */
.ticket-header,
.body-wrapper .ticket-info,
.body-wrapper .ticket-summary-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 1.5rem 1.75rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.body-wrapper .ticket-info h2,
.ticket-header h1, .ticket-header h2 {
  font-family: 'Geist', system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -.015em;
  color: var(--dm-900, #0a1525);
  margin-top: 0;
}

/* Ticket meta info */
.ticket-info .meta, .ticket-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  font-size: .875rem;
  color: #475569;
}
.ticket-info .meta strong, .ticket-meta strong { color: var(--dm-900, #0a1525); }

/* Ticket replies (mensagens) */
.ticket-replies .ticket-reply,
.body-wrapper .ticket-message,
.body-wrapper .ticket-reply {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1rem;
  box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}
/* Reply do staff (cliente comum vê com bg colorido) */
.ticket-reply.staff,
.ticket-reply.is-staff,
.ticket-reply[data-staff="true"] {
  background: var(--dm-50, #f0faff);
  border-color: var(--dm-200, #b9e3fa);
}
.ticket-reply .reply-header,
.ticket-reply .author {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin-bottom: .65rem;
  padding-bottom: .65rem;
  border-bottom: 1px solid #f1f5f9;
}
.ticket-reply .reply-header .name,
.ticket-reply .author-name {
  font-weight: 600;
  color: var(--dm-900, #0a1525);
}
.ticket-reply .reply-header .date,
.ticket-reply .author-date,
.ticket-reply .timestamp {
  color: #64748b;
  font-size: .8125rem;
}
.ticket-reply .message-body, .ticket-reply .reply-body {
  color: #1e293b;
  line-height: 1.6;
}

/* Ticket status pill */
.ticket-status, span.label[class*="ticket"] {
  display: inline-block;
  padding: .3rem .75rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: .75rem;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.ticket-status.open, .ticket-status.in-progress { background: #dcfce7; color: #166534; }
.ticket-status.answered { background: #dbeafe; color: #1e40af; }
.ticket-status.customer-reply { background: #fef3c7; color: #92400e; }
.ticket-status.closed { background: #f1f5f9; color: #475569; }
.ticket-status.on-hold { background: #fed7aa; color: #9a3412; }

/* Reply form */
form[name="ticketreply"], form#ticketreply, .reply-form-container {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 1.5rem;
  margin-top: 1.5rem;
}
form[name="ticketreply"] textarea,
form#ticketreply textarea {
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  min-height: 120px;
  padding: .75rem 1rem;
  font-size: .95rem;
  width: 100%;
}

/* Tickets list (supportticketslist.tpl) */
.tickets-list .ticket-row, table.ticketslist tbody tr {
  transition: background .12s ease;
}
.tickets-list .ticket-row:hover, table.ticketslist tbody tr:hover { background: var(--dm-50, #f0faff) !important; cursor: pointer; }
table.ticketslist th {
  background: #f8fafc;
  color: #475569;
  font-weight: 600;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: .85rem 1rem;
  border-bottom: 1px solid #e2e8f0;
}
table.ticketslist td { padding: .9rem 1rem; }

/* "New Ticket" button */
a[href*="submitticket"].btn-primary,
a[href*="submitticket"].btn,
.btn-new-ticket {
  background: linear-gradient(135deg, var(--dm-400, #54bcf8) 0%, var(--dm-600, #0084B6) 100%) !important;
  border: none !important;
  color: #fff !important;
  border-radius: 10px;
  padding: .65rem 1.25rem;
  font-weight: 600;
  box-shadow: 0 4px 12px rgba(0,132,182,0.25);
}

/* Homepage: cola hero no menu, esconde breadcrumb */
body:has(.dm-hero) .master-breadcrumb { display: none !important; }
body:has(.dm-hero) #main-body { padding-top: 0 !important; }
body:has(.dm-hero) #main-body > .container { padding-left: 0 !important; padding-right: 0 !important; max-width: 100% !important; }
body:has(.dm-hero) #main-body > .container > .row { margin-left: 0 !important; margin-right: 0 !important; }
body:has(.dm-hero) #main-body > .container > .row > .col-12 { padding-left: 0 !important; padding-right: 0 !important; }
.dm-hero { margin: 0 !important; border-radius: 0; }
/* mas restaurar container interno do que vem depois do hero */
body:has(.dm-hero) #main-body > .container > .row > .col-12 > *:not(.dm-hero) { padding-left: 15px; padding-right: 15px; max-width: 1200px; margin-left: auto; margin-right: auto; }

/* ============================================================
   DM 2026 — Cart product cards (planos)
   ============================================================ */
:root {
  --dm-50: #f0faff; --dm-200: #b9e3fa; --dm-300: #8ad2f9; --dm-400: #54bcf8;
  --dm-600: #0084B6; --dm-700: #006a99; --dm-900: #0a1525;
}

#order-standard_cart h1, .body-wrapper h1 {
  font-family: 'Geist', system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--dm-900);
  margin-bottom: 1.5rem;
}

/* Grid spacing */
#products .row.row-eq-height { row-gap: 1.5rem; }
#products .col-md-6 { display: flex; }

/* Card */
#products .product {
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  padding: 0;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  overflow: hidden;
}
#products .product:hover {
  transform: translateY(-4px);
  border-color: var(--dm-300);
  box-shadow: 0 12px 28px -10px rgba(0,132,182,0.25), 0 4px 12px rgba(15,23,42,0.06);
}

/* Header */
#products .product > header {
  background: linear-gradient(135deg, var(--dm-50) 0%, #fff 100%);
  padding: 1.5rem 1.75rem 1.25rem;
  border-bottom: 1px solid #f1f5f9;
}
#products .product > header span[id$="-name"] {
  font-family: 'Geist', system-ui, sans-serif;
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -.015em;
  color: var(--dm-900);
  display: block;
}

/* Description body */
#products .product .product-desc {
  padding: 1.5rem 1.75rem;
  flex: 1;
  color: #334155;
  font-size: .95rem;
  line-height: 1.55;
}
#products .product .product-desc p strong {
  color: var(--dm-900);
  font-weight: 600;
  font-size: 1rem;
  display: block;
  margin-bottom: 1rem;
}
#products .product .product-desc ul {
  list-style: none;
  padding: 0;
  margin: 0 0 .5rem;
}
#products .product .product-desc ul li {
  position: relative;
  padding: .35rem 0 .35rem 1.6rem;
  color: #1e293b;
  font-size: .925rem;
  line-height: 1.5;
}
#products .product .product-desc ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .5rem;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 999px;
  background: var(--dm-50);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%230084B6' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='3 8 7 12 13 4'/></svg>");
  background-size: .85rem .85rem;
  background-position: center;
  background-repeat: no-repeat;
}

/* Footer with price + CTA */
#products .product > footer {
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
  padding: 1.5rem 1.75rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: auto;
}
#products .product .product-pricing {
  text-align: left;
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}
#products .product .product-pricing .price {
  font-family: 'Geist', system-ui, sans-serif;
  font-size: 2rem;
  font-weight: 800;
  color: var(--dm-700);
  letter-spacing: -.03em;
  display: block;
}
#products .product .product-pricing br { display: none; }
#products .product .product-pricing {
  font-size: .8rem;
  font-weight: 500;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .05em;
}

/* CTA button */
#products .product .btn-order-now,
#products .product a[id$="-order-button"] {
  background: linear-gradient(135deg, var(--dm-400) 0%, var(--dm-600) 100%) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 600;
  padding: .75rem 1.25rem;
  border-radius: 10px;
  font-size: .9rem;
  white-space: normal;
  text-align: center;
  box-shadow: 0 4px 12px rgba(0,132,182,0.25);
  transition: transform .15s ease, box-shadow .15s ease;
  min-width: 160px;
}
#products .product .btn-order-now:hover,
#products .product a[id$="-order-button"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,132,182,0.35);
  color: #fff !important;
}
#products .product .btn-order-now i { margin-right: .35rem; }

/* Sidebar polish */
.panel-sidebar.card {
  border-radius: 14px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
  overflow: hidden;
}
.panel-sidebar .card-header,
.panel-sidebar .panel-heading {
  background: linear-gradient(135deg, var(--dm-50) 0%, #fff 100%);
  border-bottom: 1px solid #e2e8f0;
  padding: .9rem 1.1rem;
}
.panel-sidebar .panel-title {
  font-family: 'Geist', system-ui, sans-serif;
  font-weight: 600;
  color: var(--dm-900);
  font-size: 1rem;
  margin: 0;
}
.panel-sidebar .list-group-item {
  border: none;
  border-top: 1px solid #f1f5f9;
  padding: .75rem 1.1rem;
  color: #334155;
  font-size: .92rem;
  transition: background .12s ease, color .12s ease;
}
.panel-sidebar .list-group-item:first-child { border-top: none; }
.panel-sidebar .list-group-item:hover {
  background: var(--dm-50);
  color: var(--dm-700);
}
.panel-sidebar .list-group-item.active {
  background: var(--dm-600) !important;
  color: #fff !important;
  border-color: var(--dm-600) !important;
}
.panel-sidebar .list-group-item i { margin-right: .5rem; color: var(--dm-600); width: 1rem; text-align: center; }
.panel-sidebar .list-group-item.active i { color: #fff; }

/* Responsive: stack footer on mobile */
@media (max-width: 575.98px) {
  #products .product > footer { flex-direction: column; align-items: stretch; text-align: center; }
  #products .product .product-pricing { text-align: center; align-items: center; }
  #products .product .btn-order-now { width: 100%; }
}

/* Cart cards — refine footer (stack vertical, button full width) */
#products .product > footer {
  flex-direction: column !important;
  align-items: stretch !important;
  text-align: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem 1.5rem;
}
#products .product .product-pricing {
  text-align: center !important;
  align-items: center !important;
  flex-direction: column !important;
  display: flex !important;
  gap: .15rem;
}
#products .product .product-pricing .price {
  font-size: 2.25rem;
  line-height: 1;
}
#products .product .product-pricing,
#products .product .product-pricing > * {
  font-size: .75rem;
}
#products .product .product-pricing .price { font-size: 2.25rem !important; }
#products .product .btn-order-now,
#products .product a[id$="-order-button"] {
  width: 100%;
  white-space: nowrap;
  padding: .85rem 1rem;
  font-size: .95rem;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
}

/* Cards: ensure description doesn't push footer with huge gap */
#products .product .product-desc {
  padding: 1.25rem 1.5rem 1rem;
}
#products .product .product-desc ul li {
  padding: .3rem 0 .3rem 1.5rem;
  font-size: .9rem;
}

/* Sutil divider antes do footer */
#products .product > footer { border-top: 1px solid #e2e8f0; background: #fafbfc; }

/* Cart cards — hard fix botão estourando o card */
#products .product { box-sizing: border-box; }
#products .product * { box-sizing: border-box; }
#products .product > footer {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  padding: 1.25rem 1.5rem 1.5rem !important;
  background: linear-gradient(180deg, #fafbfc 0%, #f1f5f9 100%) !important;
  border-top: 1px solid #e2e8f0 !important;
  margin: 0 !important;
}
#products .product .product-pricing {
  width: 100%;
  margin: 0 0 1rem 0 !important;
  padding: 0 !important;
  text-align: center;
}
#products .product .product-pricing .price {
  display: block;
  font-size: 2.4rem !important;
  font-weight: 800;
  color: var(--dm-700, #006a99);
  line-height: 1;
  margin-bottom: .25rem;
}
#products .product a[id$="-order-button"],
#products .product .btn-order-now {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: .9rem 1rem !important;
  white-space: nowrap !important;
  font-size: .95rem !important;
  font-weight: 600;
  border-radius: 10px !important;
  background: linear-gradient(135deg, var(--dm-400, #54bcf8) 0%, var(--dm-600, #0084B6) 100%) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(0,132,182,0.25);
  text-decoration: none;
  box-sizing: border-box !important;
}

/* clearfix do .product não atrapalhar o flex */
#products .product.clearfix::before,
#products .product.clearfix::after { display: none !important; }

/* Cart layout: sidebar no topo (horizontal), planos full-width 4 colunas */
#order-standard_cart > .row {
  display: flex !important;
  flex-direction: column !important;
}
#order-standard_cart > .row > .cart-sidebar {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  margin-bottom: 1.5rem;
}
#order-standard_cart > .row > .cart-body {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
}

/* Sidebar painéis lado a lado */
.cart-sidebar {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  flex-wrap: wrap;
}
.cart-sidebar > .panel-sidebar {
  flex: 1 1 280px;
  margin-bottom: 0 !important;
}

/* Categorias: items horizontais */
.cart-sidebar .panel-sidebar:first-child .list-group {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  padding: .75rem 1.1rem;
}
.cart-sidebar .panel-sidebar:first-child .list-group-item {
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  padding: .4rem 1rem !important;
  font-size: .875rem;
  background: #fff;
}
.cart-sidebar .panel-sidebar:first-child .list-group-item.active {
  background: var(--dm-600, #0084B6) !important;
  border-color: var(--dm-600, #0084B6) !important;
}

/* Ações: items horizontais */
.cart-sidebar .panel-sidebar:nth-child(2) .list-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding: 0;
}
.cart-sidebar .panel-sidebar:nth-child(2) .list-group-item {
  flex: 1 1 auto;
  border-top: none;
  border-left: 1px solid #f1f5f9;
}
.cart-sidebar .panel-sidebar:nth-child(2) .list-group-item:first-child { border-left: none; }

/* Produtos em 4 colunas */
@media (min-width: 992px) {
  #products .row.row-eq-height {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 1.5rem;
  }
  #products .row.row-eq-height > .col-md-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: unset !important;
    padding: 0 !important;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  #products .row.row-eq-height {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.5rem;
  }
  #products .row.row-eq-height > .col-md-6 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }
}

/* Cards mais compactos em 4 colunas */
@media (min-width: 992px) {
  #products .product > header { padding: 1.25rem 1.25rem 1rem; }
  #products .product > header span[id$="-name"] { font-size: 1.2rem; }
  #products .product .product-desc { padding: 1rem 1.25rem; }
  #products .product .product-desc p strong { font-size: .95rem; margin-bottom: .75rem; }
  #products .product .product-desc ul li { font-size: .85rem; padding: .25rem 0 .25rem 1.4rem; }
  #products .product > footer { padding: 1rem 1.25rem 1.25rem !important; }
  #products .product .product-pricing .price { font-size: 1.9rem !important; }
  #products .product a[id$="-order-button"] { padding: .7rem .75rem !important; font-size: .85rem !important; }
}

/* Cart 4 cols — WHMCS renderiza 2 cards por .row, então fazemos as rows colapsarem */
@media (min-width: 992px) {
  #products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 1.5rem;
  }
  #products .row.row-eq-height {
    display: contents !important;
  }
  #products .row.row-eq-height > .col-md-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: unset !important;
    padding: 0 !important;
    display: flex;
  }
  /* h1 do "Hospedagem" precisa abranger o grid todo */
  .cart-body > h1, .cart-body > .header-lined { grid-column: 1 / -1; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  #products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.5rem;
  }
  #products .row.row-eq-height { display: contents !important; }
  #products .row.row-eq-height > .col-md-6 {
    width: 100% !important; max-width: 100% !important; padding: 0 !important; display: flex;
  }
}

/* Sidebar headers — sempre claros (mobile incluso) */
.panel-sidebar .card-header,
.panel-sidebar .panel-heading,
.cart-sidebar .panel-sidebar .card-header,
.cart-sidebar .panel-sidebar .panel-heading {
  background: linear-gradient(135deg, var(--dm-50, #f0faff) 0%, #fff 100%) !important;
  color: var(--dm-900, #0a1525) !important;
  border-bottom: 1px solid #e2e8f0 !important;
}
.panel-sidebar .card-header *,
.panel-sidebar .panel-heading *,
.panel-sidebar .panel-title,
.panel-sidebar .panel-title * {
  color: var(--dm-900, #0a1525) !important;
}
.panel-sidebar .card-header i,
.panel-sidebar .panel-heading i {
  color: var(--dm-600, #0084B6) !important;
}

/* Sidebar mobile (panel-default usado em sidebar-categories-collapsed) */
.cart-sidebar .panel.panel-default,
.cart-sidebar .panel-default {
  border-radius: 14px !important;
  border: 1px solid #e2e8f0 !important;
  overflow: hidden;
  background: #fff !important;
}
.cart-sidebar .panel-default > .card-header,
.cart-sidebar .panel-default > .panel-heading {
  background: linear-gradient(135deg, var(--dm-50, #f0faff) 0%, #fff 100%) !important;
  background-color: var(--dm-50, #f0faff) !important;
  color: var(--dm-900, #0a1525) !important;
  border-bottom: 1px solid #e2e8f0 !important;
}
.cart-sidebar .panel-default > .card-header *,
.cart-sidebar .panel-default > .panel-heading * {
  color: var(--dm-900, #0a1525) !important;
}
.cart-sidebar .panel-default > .card-header i,
.cart-sidebar .panel-default > .panel-heading i {
  color: var(--dm-600, #0084B6) !important;
}

/* Sidebar mobile (sidebar-collapsed dentro de .cart-body) */
.sidebar-collapsed .panel.panel-default,
.sidebar-collapsed .panel-default {
  border-radius: 14px !important;
  border: 1px solid #e2e8f0 !important;
  overflow: hidden;
  background: #fff !important;
  margin-bottom: 1rem;
}
.sidebar-collapsed .panel-default > .card-header,
.sidebar-collapsed .panel-default > .panel-heading {
  background: linear-gradient(135deg, var(--dm-50, #f0faff) 0%, #fff 100%) !important;
  background-color: var(--dm-50, #f0faff) !important;
  color: var(--dm-900, #0a1525) !important;
  border-bottom: 1px solid #e2e8f0 !important;
}
.sidebar-collapsed .panel-default > .card-header *,
.sidebar-collapsed .panel-default > .panel-heading *,
.sidebar-collapsed .panel-default .panel-title {
  color: var(--dm-900, #0a1525) !important;
}
.sidebar-collapsed .panel-default > .card-header i,
.sidebar-collapsed .panel-default > .panel-heading i {
  color: var(--dm-600, #0084B6) !important;
}
.sidebar-collapsed .panel-default .panel-body,
.sidebar-collapsed .panel-default .card-body {
  padding: 1rem;
}

/* Force collapse — vence regra :first-child do listing horizontal */
.cart-sidebar .panel-sidebar:not(.is-expanded) .collapsable-card-body,
.cart-sidebar .panel-sidebar:not(.is-expanded) .list-group,
.sidebar-collapsed .panel-default:not(.is-expanded) .collapsable-card-body,
.sidebar-collapsed .panel-default:not(.is-expanded) .list-group {
  display: none !important;
}


/* Remove linha cinza divider acima do preço */
#products .product > footer { border-top: none !important; }


/* product-desc full width */
#order-standard_cart .products .product div.product-desc {
  float: none !important;
  width: 100% !important;
}


/* Header — remove bordas dos elementos da toolbar e search */
header.header .search { border: none !important; }
header.header .toolbar .nav-link { border: none !important; }


/* Logo desktop max-width 300px */
@media (min-width: 1200px) {
  header.header .logo-img,
  header.header .navbar-brand .logo-img { max-width: 250px !important; height: auto !important; }
}


/* Homepage section titles — design moderno com eyebrow + título grande */
.dm-section-title {
  font-family: 'Geist', system-ui, sans-serif !important;
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  letter-spacing: -.02em !important;
  color: var(--dm-900, #0a1525) !important;
  text-align: left !important;
  margin: 3rem 0 1.5rem !important;
  padding: 0 !important;
  position: relative;
  display: flex;
  align-items: center;
  gap: .9rem;
}
.dm-section-title::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 28px;
  background: linear-gradient(180deg, var(--dm-400, #54bcf8) 0%, var(--dm-600, #0084B6) 100%);
  border-radius: 4px;
  flex-shrink: 0;
}
.dm-section-title::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, #e2e8f0 0%, transparent 100%);
  margin-left: 1rem;
}

/* primeira section title cola mais com o hero */
.dm-section-title:first-of-type { margin-top: 2.5rem !important; }

@media (max-width: 575.98px) {
  .dm-section-title { font-size: 1.4rem !important; margin: 2rem 0 1rem !important; }
  .dm-section-title::before { height: 22px; }
}


/* Section titles — alinhar com max-width dos grids */
.dm-section-title {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}


/* ============================================================
   DM 2026 — Form inputs (login, register, generic)
   ============================================================ */
.body-wrapper input[type="text"],
.body-wrapper input[type="email"],
.body-wrapper input[type="password"],
.body-wrapper input[type="tel"],
.body-wrapper input[type="number"],
.body-wrapper input[type="url"],
.body-wrapper input[type="search"],
.body-wrapper input[type="date"],
.body-wrapper select,
.body-wrapper textarea,
.body-wrapper .form-control {
  border: 1px solid #cbd5e1 !important;
  border-radius: 10px !important;
  padding: .65rem .9rem !important;
  font-size: .95rem !important;
  background-color: #fff !important;
  color: #0f172a !important;
  box-shadow: none !important;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
  height: auto;
}
.body-wrapper input:focus,
.body-wrapper select:focus,
.body-wrapper textarea:focus,
.body-wrapper .form-control:focus {
  border-color: var(--dm-400, #54bcf8) !important;
  box-shadow: 0 0 0 3px rgba(84,188,248,.18) !important;
  outline: none !important;
}
.body-wrapper input::placeholder,
.body-wrapper textarea::placeholder {
  color: #94a3b8;
  opacity: 1;
}

/* Labels */
.body-wrapper form label,
.body-wrapper .form-group label,
.body-wrapper .field-label {
  font-weight: 500 !important;
  color: #334155 !important;
  font-size: .875rem !important;
  margin-bottom: .4rem !important;
}

/* Input group prepend (ícone à esquerda) */
.body-wrapper .input-group .input-group-prepend .input-group-text,
.body-wrapper .input-group-text {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  border-right: none !important;
  border-radius: 10px 0 0 10px !important;
  color: var(--dm-600, #0084B6) !important;
  padding: 0 .9rem !important;
}
.body-wrapper .input-group > .form-control:not(:first-child) {
  border-left: none !important;
  border-radius: 0 10px 10px 0 !important;
}
.body-wrapper .input-group:focus-within .input-group-text {
  border-color: var(--dm-400, #54bcf8) !important;
}

/* Append (botões dentro de input-group, ex: olho da senha) */
.body-wrapper .input-group .input-group-append .input-group-text,
.body-wrapper .input-group .input-group-append .btn {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  border-left: none !important;
  border-radius: 0 10px 10px 0 !important;
  color: #64748b !important;
  padding: 0 .9rem !important;
}
.body-wrapper .input-group > .form-control:not(:last-child) {
  border-right: none !important;
  border-radius: 10px 0 0 10px !important;
}
.body-wrapper .input-group > .form-control:not(:first-child):not(:last-child) {
  border-radius: 0 !important;
}

/* Cards / panels que envolvem forms (login, signup) */
.body-wrapper .panel.panel-default,
.body-wrapper .card.panel-default,
.body-wrapper .login-container,
.body-wrapper .signup-container {
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  box-shadow: 0 1px 2px rgba(15,23,42,.04) !important;
  background: #fff !important;
}
.body-wrapper .panel.panel-default > .panel-heading,
.body-wrapper .card.panel-default > .card-header {
  background: linear-gradient(135deg, var(--dm-50, #f0faff) 0%, #fff 100%) !important;
  border-bottom: 1px solid #e2e8f0 !important;
  color: var(--dm-900, #0a1525) !important;
  border-radius: 16px 16px 0 0 !important;
}

/* Botões primários padronizados (se sobrar default Bootstrap) */
.body-wrapper .btn-primary,
.body-wrapper button[type="submit"]:not(.btn-success):not(.btn-danger):not(.btn-link):not(.btn-facebook) {
  background: linear-gradient(135deg, var(--dm-400, #54bcf8) 0%, var(--dm-600, #0084B6) 100%) !important;
  border: none !important;
  color: #fff !important;
  border-radius: 10px !important;
  padding: .65rem 1.5rem !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 12px rgba(0,132,182,.20);
  transition: transform .15s ease, box-shadow .15s ease;
}
.body-wrapper .btn-primary:hover,
.body-wrapper button[type="submit"]:not(.btn-success):not(.btn-danger):not(.btn-link):not(.btn-facebook):hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,132,182,.30);
  color: #fff !important;
}

/* Checkbox / radio */
.body-wrapper input[type="checkbox"],
.body-wrapper input[type="radio"] {
  accent-color: var(--dm-600, #0084B6);
  width: 16px;
  height: 16px;
  vertical-align: middle;
}

/* Login page específico */
.login-container .card,
.login-container .panel {
  padding: .5rem;
}
.login-container h1, .login-container h2, .login-container h3 {
  font-family: 'Geist', system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -.015em;
  color: var(--dm-900, #0a1525);
}

/* Links de "Esqueceu a senha?" / "Criar conta" */
.body-wrapper a.text-primary,
.body-wrapper a[href*="pwreset"],
.body-wrapper a[href*="register"] {
  color: var(--dm-600, #0084B6) !important;
  font-weight: 500;
}
.body-wrapper a.text-primary:hover { color: var(--dm-700, #006a99) !important; }

/* ============================================================
   2026-05-05 — Client Area: product details polish
   ============================================================ */

/* Card headers (cPanel module SSO + sidebar painéis)
   Antes: gradiente azul-escuro com texto também escuro = ilegível.
   Agora: header com a mesma identidade clara dos cards da Hospedagem. */
.client-home-cards .card > .card-header,
.body-wrapper .card > .card-header,
.body-wrapper .panel > .panel-heading,
.product-details-tab-container .card-header,
.tab-content .card .card-header {
  background: linear-gradient(135deg, var(--dm-900, #0a1525) 0%, #0f1d33 100%) !important;
  color: #fff !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  padding: .85rem 1.1rem !important;
}
.client-home-cards .card > .card-header *,
.body-wrapper .card > .card-header *,
.body-wrapper .panel > .panel-heading *,
.product-details-tab-container .card-header *,
.tab-content .card .card-header * {
  color: #fff !important;
}
.client-home-cards .card > .card-header h1,
.client-home-cards .card > .card-header h2,
.client-home-cards .card > .card-header h3,
.client-home-cards .card > .card-header h4,
.client-home-cards .card > .card-header h5,
.client-home-cards .card > .card-header h6,
.body-wrapper .card > .card-header .card-title,
.body-wrapper .panel > .panel-heading .panel-title {
  font-family: 'Geist', system-ui, sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: -.015em !important;
  font-size: 1rem !important;
  margin: 0 !important;
  line-height: 1.35 !important;
}
.client-home-cards .card > .card-header i,
.body-wrapper .card > .card-header i {
  color: var(--dm-300, #54bcf8) !important;
}

/* Sidebar (Visão geral / Ações) — manter claro como já estava
   Re-afirma para não cair no gradiente acima */
.panel-sidebar .card > .card-header,
.panel-sidebar .panel > .panel-heading {
  background: linear-gradient(135deg, var(--dm-50, #f0faff) 0%, #fff 100%) !important;
  color: var(--dm-900, #0a1525) !important;
  border-bottom: 1px solid #e2e8f0 !important;
}
.panel-sidebar .card > .card-header *,
.panel-sidebar .panel > .panel-heading * {
  color: var(--dm-900, #0a1525) !important;
}
.panel-sidebar .card > .card-header i,
.panel-sidebar .panel > .panel-heading i {
  color: var(--dm-600, #0084B6) !important;
}

/* Botões "Visite o Website" / "Gerenciar Domínio" / "+ Criar"
   estavam azul com texto escuro — força contraste */
.body-wrapper .btn-info,
.body-wrapper .btn-primary,
.body-wrapper .btn.btn-info,
.body-wrapper .btn.btn-primary,
.client-home-cards .btn-info,
.client-home-cards .btn-primary {
  color: #fff !important;
}
.body-wrapper .btn-default,
.body-wrapper .btn.btn-default {
  background: #fff !important;
  color: var(--dm-900, #0a1525) !important;
  border: 1px solid #d1d9e3 !important;
}
.body-wrapper .btn-default:hover,
.body-wrapper .btn.btn-default:hover {
  background: var(--dm-50, #f0faff) !important;
  border-color: var(--dm-400, #54bcf8) !important;
  color: var(--dm-900, #0a1525) !important;
}

/* Atalhos rápidos cPanel — ícones grandes coloridos legíveis */
.client-home-cards .card .card-body .text-center img,
.client-home-cards .card .card-body .text-center i {
  filter: none;
}

/* Visão Geral do Faturamento — transformar pares col-sm-6 em definição
   Antes: labels à direita coladas com valores à esquerda, sem separador.
   Layout existente na clientareaproductdetails.tpl é uma série de
   <div class="row"><div class="col-sm-5 text-right"><strong>label</strong></div>
   <div class="col-sm-7 text-left">valor</div></div> — vamos pintar separadores. */
.product-details-tab-container .row,
.product-details-tab-container > .tab-pane > .row {
  border-bottom: 1px solid #eef1f6;
  padding: .65rem 0;
  margin: 0 !important;
  align-items: baseline;
}
.product-details-tab-container .row:last-child {
  border-bottom: none;
}
.product-details-tab-container .row .text-right strong {
  color: var(--dm-700, #006a99) !important;
  font-weight: 600;
  letter-spacing: -.01em;
}
.product-details-tab-container .tab-pane {
  padding: .25rem 1rem .75rem !important;
}

/* Card "Visão Geral do Faturamento" do cPanel module: definição em 2 colunas */
.client-home-cards .card .card-body .row {
  border-bottom: 1px solid #eef1f6;
  padding: .55rem 0;
  margin: 0 !important;
}
.client-home-cards .card .card-body .row:last-child {
  border-bottom: none;
}

/* Estatísticas de uso (dois gauges): esticar */
.client-home-cards .card .card-body .text-center h4 {
  font-family: 'Geist', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: .92rem !important;
  color: var(--dm-900, #0a1525) !important;
  margin-top: .5rem !important;
}

/* Form "Criar conta de e-mail rapidamente": gap entre inputs */
.client-home-cards .card .card-body form .form-control {
  border-radius: 8px !important;
  border-color: #d1d9e3 !important;
}
.client-home-cards .card .card-body form .input-group .input-group-text,
.client-home-cards .card .card-body form .input-group-addon {
  background: #f1f5f9 !important;
  border-color: #d1d9e3 !important;
  color: #475569 !important;
}