/* ==========================================================================
   WooPanel — Tema COLORIA para [woopanel_cadastro_de_produtos]
   Nova etapa: primeiro tema do sistema de temas do frontend.

   ISOLAMENTO CRÍTICO: toda regra deste arquivo é escopada pelo seletor
   ".woopanel-new-cadastro--theme-coloria" (classe modificadora aplicada
   pelo JS apenas na raiz do shortcode quando o usuário ativa o tema).
   Nada aqui usa seletores soltos — mesmo classes "genéricas" reaproveitadas
   da tabela (.woopanel-btn, .woopanel-badge, etc.) só são afetadas quando
   estiverem DENTRO da raiz com o tema ativo, o que só acontece dentro do
   [woopanel_cadastro_de_produtos]. Nenhum outro shortcode, o WooCommerce,
   o Elementor, o Gutenberg ou o wp-admin são tocados.

   CONCEITO: interface vibrante, colorida e cheia de personalidade — o
   oposto de um dashboard corporativo minimalista. Paleta rica (rosa,
   roxo, laranja, amarelo, azul elétrico) organizada com hierarquia clara:
   a barra lateral e os destaques concentram a cor; a tabela em si
   permanece legível, com acentos coloridos pontuais.
   ========================================================================== */

.woopanel-new-cadastro--theme-coloria {
    /* Paleta exclusiva do tema — não interfere nos tokens globais do WooPanel,
       pois só existe dentro deste seletor com modificador de tema. */
    --coloria-pink:    #ff3d81;
    --coloria-purple:  #7c3aed;
    --coloria-orange:  #ff7a1a;
    --coloria-yellow:  #ffc93c;
    --coloria-blue:    #2fa5ff;
    --coloria-green:   #17c993;
    --coloria-coral:   #ff5c6c;
    --coloria-ink:     #241a3d;

    --coloria-gradient-brand: linear-gradient(135deg, var(--coloria-pink) 0%, var(--coloria-purple) 55%, var(--coloria-blue) 100%);
    --coloria-gradient-warm:  linear-gradient(135deg, var(--coloria-orange) 0%, var(--coloria-pink) 100%);

    gap: 24px;
}

/* --------------------------------------------------------------------------
   Fundo geral — envolve sidebar + conteúdo num "cartão" vibrante
   -------------------------------------------------------------------------- */
.woopanel-new-cadastro--theme-coloria {
    padding: 20px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 0% 0%, rgba(255, 61, 129, 0.16) 0%, transparent 45%),
        radial-gradient(circle at 100% 0%, rgba(47, 165, 255, 0.16) 0%, transparent 45%),
        radial-gradient(circle at 100% 100%, rgba(255, 201, 60, 0.14) 0%, transparent 45%),
        linear-gradient(180deg, #fdf6ff 0%, #f6f4ff 100%);
}

/* --------------------------------------------------------------------------
   Barra lateral — elemento de maior destaque do tema
   -------------------------------------------------------------------------- */
.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-sidebar {
    background: var(--coloria-gradient-brand);
    border: none;
    border-radius: 20px;
    box-shadow: 0 12px 30px rgba(124, 58, 237, 0.35);
    padding: 16px;
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-sidebar-header {
    border-bottom-color: rgba(255, 255, 255, 0.25);
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-sidebar-title {
    color: rgba(255, 255, 255, 0.85);
    letter-spacing: 1px;
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-nav-item {
    color: #ffffff;
    font-weight: 700;
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-nav-item:hover {
    background: rgba(255, 255, 255, 0.16);
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-nav-item[aria-expanded="true"] {
    background: rgba(255, 255, 255, 0.22);
    color: #ffffff;
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.35);
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-nav-icon {
    font-size: 20px;
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.25));
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-nav-caret {
    color: rgba(255, 255, 255, 0.85);
}

/* --------------------------------------------------------------------------
   Painel de temas — cartão claro flutuando sobre a sidebar colorida
   -------------------------------------------------------------------------- */
.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-themes-panel {
    margin-top: 8px;
    padding: 14px;
    background: rgba(255, 255, 255, 0.94);
    border-radius: 16px;
    box-shadow: 0 6px 16px rgba(36, 26, 61, 0.18);
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-themes-panel-title {
    color: var(--coloria-purple);
    font-weight: 600;
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-theme-card {
    background: #f7f3ff;
    border: 2px solid transparent;
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-theme-card:hover {
    border-color: rgba(124, 58, 237, 0.3);
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-theme-card.is-active {
    background: var(--coloria-gradient-brand);
    border-color: transparent;
    box-shadow: 0 8px 18px rgba(124, 58, 237, 0.35);
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-theme-card.is-active .woopanel-new-cadastro-theme-card-name,
.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-theme-card.is-active .woopanel-new-cadastro-theme-card-desc {
    color: #ffffff;
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-theme-card-name {
    color: var(--coloria-ink);
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-theme-card-status {
    background: #ffffff;
    color: var(--coloria-purple);
    border-color: rgba(124, 58, 237, 0.25);
}

.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-theme-card.is-active .woopanel-new-cadastro-theme-card-status {
    background: #ffffff;
    color: var(--coloria-pink);
    border-color: #ffffff;
    animation: woopanel-coloria-pulse 1.8s ease-in-out infinite;
}

@keyframes woopanel-coloria-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6); }
    50%      { box-shadow: 0 0 0 5px rgba(255, 255, 255, 0); }
}

/* --------------------------------------------------------------------------
   Conteúdo principal — a tabela de produtos ganha acentos coloridos
   pontuais, mantendo a legibilidade dos dados.
   -------------------------------------------------------------------------- */
.woopanel-new-cadastro--theme-coloria .woopanel-new-cadastro-main .woopanel-products-table-wrapper {
    border: none;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(124, 58, 237, 0.16);
}

.woopanel-new-cadastro--theme-coloria .woopanel-products-table thead th {
    background: var(--coloria-gradient-brand);
    color: #ffffff;
    font-weight: 700;
    letter-spacing: 0.3px;
    border-color: transparent;
}

.woopanel-new-cadastro--theme-coloria .woopanel-products-table tbody tr {
    border-left: 4px solid transparent;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.woopanel-new-cadastro--theme-coloria .woopanel-products-table tbody tr:hover {
    background: #fbf7ff;
    border-left-color: var(--coloria-pink);
}

.woopanel-new-cadastro--theme-coloria .woopanel-product-name {
    color: var(--coloria-ink);
    font-weight: 700;
}

.woopanel-new-cadastro--theme-coloria .col-price {
    color: var(--coloria-purple);
    font-weight: 700;
}

/* Badges de tipo de produto */
.woopanel-new-cadastro--theme-coloria .woopanel-badge-type-simple {
    background: rgba(23, 201, 147, 0.14);
    color: #0e8f68;
}

.woopanel-new-cadastro--theme-coloria .woopanel-badge-type-variable {
    background: rgba(124, 58, 237, 0.14);
    color: var(--coloria-purple);
}

/* Estoque */
.woopanel-new-cadastro--theme-coloria .woopanel-stock-qty {
    color: #0e8f68;
    font-weight: 700;
}

.woopanel-new-cadastro--theme-coloria .woopanel-stock-out {
    color: var(--coloria-coral);
    font-weight: 700;
}

/* Status (publicado/privado) */
.woopanel-new-cadastro--theme-coloria .woopanel-badge-status-publish {
    background: rgba(23, 201, 147, 0.14);
    color: #0e8f68;
}

.woopanel-new-cadastro--theme-coloria .woopanel-badge-status-private {
    background: rgba(255, 122, 26, 0.16);
    color: #b85300;
}

.woopanel-new-cadastro--theme-coloria .woopanel-status-select {
    border-radius: 999px;
    font-weight: 600;
}

/* Botões de ação */
.woopanel-new-cadastro--theme-coloria .woopanel-btn {
    border-radius: 999px;
    font-weight: 700;
    border: none;
    color: #ffffff;
}

.woopanel-new-cadastro--theme-coloria .woopanel-btn-edit {
    background: var(--coloria-blue);
}

.woopanel-new-cadastro--theme-coloria .woopanel-btn-duplicate {
    background: var(--coloria-purple);
}

.woopanel-new-cadastro--theme-coloria .woopanel-btn-delete {
    background: var(--coloria-coral);
}

.woopanel-new-cadastro--theme-coloria .woopanel-btn:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
}