body { background: #0c1b33; color: #0d1c2e; }

.card { box-shadow: 0 6px 16px rgba(0,0,0,0.15); }

.section-title { color: #0c1b33; font-weight: 700; }

.nav-top { background: #fff; }

.album-card { cursor: pointer; transition: transform 0.1s ease; }

.album-card:hover { transform: translateY(-2px); }

.album-card .mt-auto > .d-flex.gap-1:not(.mb-2) {

    display: grid !important;

    grid-template-columns: repeat(5, minmax(0, 1fr));

    align-items: stretch;

}

.album-card .mt-auto > .d-flex.gap-1:not(.mb-2) > .btn {

    width: 100%;

    min-width: 0;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding-left: 0;

    padding-right: 0;

}

.badge-pill { border-radius: 999px; }

.photo-thumb { width: 100%; height: clamp(120px, 18vw, 190px); object-fit: cover; border-radius: 8px; }

.selected-thumb { width: 100%; height: clamp(90px, 14vw, 120px); object-fit: cover; border-radius: 10px; }

.bg-surface { background: #f5f7fb; }

label, .form-label { color: #dc2626 !important; }


/* Bloco Valor + Condicao (acabamento visual) */

#precoVenda {

    border: 1.5px solid #d5deea;

    border-radius: 10px;

    background: #ffffff;

    font-weight: 600;

    color: #0f172a;

    transition: border-color 0.2s ease, box-shadow 0.2s ease;

}

#precoVenda:focus {

    border-color: #2563eb;

    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);

}

#btnPrecoMedioSugestao {

    border-radius: 999px;

    border-width: 1px;

    font-weight: 700;

    letter-spacing: 0.2px;

    background: #ecfdf5;

    border-color: #16a34a;

    color: #15803d;

    box-shadow: 0 2px 8px rgba(22, 163, 74, 0.14);

}

#btnPrecoMedioSugestao:hover {

    background: #dcfce7;

    border-color: #15803d;

    color: #166534;

}

.condicao-album-title {

    color: #475569 !important;

    font-weight: 700;

    letter-spacing: 0.2px;

}

.condicao-album-card {

    border: 1px solid #dbe4ef !important;

    border-radius: 12px !important;

    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;

    padding: 8px !important;

    gap: 8px !important;

    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);

}

.condicao-album-card .form-check {

    margin: 0;

    padding: 0;

}

.condicao-album-card .form-check-input {

    position: absolute;

    opacity: 0;

    pointer-events: none;

}

.condicao-album-card .form-check-label {

    margin: 0;

    border: 1px solid #cfd8e3;

    background: #ffffff;

    color: #334155 !important;

    border-radius: 999px;

    padding: 0.3rem 0.7rem;

    font-size: 0.85rem;

    font-weight: 600;

    cursor: pointer;

    transition: all 0.15s ease;

    user-select: none;

}

.condicao-album-card .form-check-label:hover {

    border-color: #94a3b8;

    background: #f8fafc;

}

.condicao-album-card .form-check-input:checked + .form-check-label {

    color: #ffffff !important;

    border-color: #2563eb;

    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);

    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.25);

}

@media (max-width: 768px) {

    .condicao-album-card {

        padding: 7px !important;

    }

    .condicao-album-card .form-check-label {

        padding: 0.28rem 0.62rem;

        font-size: 0.82rem;

    }

}


/* Inputs file: deixar botão 'Escolher arquivos' verde com texto branco */

input[type="file"].form-control {

    background-color: #ffffff;

}

input[type="file"].form-control::file-selector-button {

    background: #16a34a;

    color: #ffffff;

    border: 1px solid #16a34a;

    border-radius: 10px;

    padding: 0.35rem 0.75rem;

    margin-right: 0.75rem;

}

input[type="file"].form-control::file-selector-button:hover {

    background: #15803d;

    border-color: #15803d;

}

input[type="file"].form-control::-webkit-file-upload-button {

    background: #16a34a;

    color: #ffffff;

    border: 1px solid #16a34a;

    border-radius: 10px;

    padding: 0.35rem 0.75rem;

    margin-right: 0.75rem;

}

input[type="file"].form-control::-webkit-file-upload-button:hover {

    background: #15803d;

    border-color: #15803d;

}


/* Melhorias gerais de responsividade */

.nav-top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 0.5rem; }

.nav-top .d-flex { flex-wrap: wrap; }

.album-card .text-truncate { max-width: 100%; }

#listaFotos .col-sm-6, #listaFotos .col-md-4, #listaFotos .col-lg-3 { display: flex; }

#listaFotos .bg-surface { width: 100%; }


@media (max-width: 992px) {

    body { padding: 0.75rem; }

    .nav-top { position: sticky; top: 0; z-index: 1020; border-radius: 14px; }

    .nav-top { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }

    .container-fluid.container-xl { padding-left: 0 !important; padding-right: 0 !important; }


    .card { border-radius: 16px; overflow: hidden; }

    .card-body { padding: 1.05rem; }


    .section-title { letter-spacing: 0.2px; }


    .form-control, .form-select { border-radius: 12px; }

    .input-group > .form-control { border-radius: 12px; }

    .input-group > .btn { border-radius: 12px; }

    .input-group { gap: 0.5rem; }


    .btn { border-radius: 12px; }

    .btn.w-100 { padding-top: 0.85rem; padding-bottom: 0.85rem; }


    #listaAlbuns { --bs-gutter-x: 0.75rem; --bs-gutter-y: 0.75rem; }

    .album-card { border-radius: 14px; }

    .album-card .card-body { padding: 0.95rem; }


    #listaFotos { --bs-gutter-x: 0.75rem; --bs-gutter-y: 0.75rem; }

    .photo-thumb { border-radius: 12px; }

    .selected-thumb { border-radius: 12px; }

}


/* Badge código mais compacto */

.code-badge {

    background: linear-gradient(135deg, #10b981 0%, #059669 100%);

    color: white;

    padding: 0.5rem 1rem;

    border-radius: 10px;

    font-weight: 600;

    font-size: 0.95rem;

    display: inline-flex;

    align-items: center;

    gap: 0.5rem;

}

    
/* Desktop: seções colapsáveis desabilitadas */

@media (min-width: 993px) {

    .collapse-section {

        border: none;

        border-radius: 0;

        margin-bottom: 0;

        overflow: visible;

    }

    .collapse-header {

        display: none !important;

    }

    .collapse-body {

        padding: 0;

        display: block !important;

    }

}

    
/* Mobile/Tablet: seções colapsáveis refinadas */

@media (max-width: 992px) {

    body { 

        background: #f0f2f5 !important; /* Fundo mais profissional */

    }

    .collapse-section {

        background: #ffffff;

        border: none;

        border-radius: 16px;

        margin-bottom: 1rem;

        overflow: hidden;

        box-shadow: 0 2px 8px rgba(0,0,0,0.05); /* Sombra suave */

    }

    .collapse-header {

        background: #ffffff;

        padding: 1rem 1.25rem;

        cursor: pointer;

        display: flex;

        justify-content: space-between;

        align-items: center;

        user-select: none;

        border-bottom: 1px solid transparent;

        transition: all 0.2s;

    }

    .collapse-header:active {

        background-color: #f8f9fa;

    }

    /* Linha separadora apenas quando aberto */

    .collapse-body.show {

        border-top: 1px solid #f0f0f0;

    }

    .collapse-header h6 {

        margin: 0;

        font-size: 1rem;

        font-weight: 700;

        color: #1f2937;

        display: flex;

        align-items: center;

    }

    .collapse-icon {

        font-size: 0.9rem;

        color: #9ca3af;

        transition: transform 0.3s ease;

        background: #f3f4f6;

        width: 28px;

        height: 28px;

        display: flex;

        align-items: center;

        justify-content: center;

        border-radius: 50%;

    }

    .collapse-icon.rotated {

        transform: rotate(180deg);

        background: #e0e7ff;

        color: #4f46e5;

    }

    .collapse-body {

        padding: 1.25rem;

        display: none;

        background: #fff;

    }

    .collapse-body.show {

        display: block;

    }

    
    /* Melhorias nos Inputs Mobile */

    .form-control, .form-select {

        background-color: #f9fafb;

        border: 1px solid #e5e7eb;

        font-size: 16px !important; /* Evita zoom no iOS */

        padding: 0.75rem;

        transition: border-color 0.2s, box-shadow 0.2s;

    }

    .form-control:focus, .form-select:focus {

        background-color: #fff;

        border-color: #4f46e5;

        box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);

    }

    
    /* Labels mais profissionais */

    .form-label {

        text-transform: uppercase;

        font-size: 0.75rem;

        letter-spacing: 0.05em;

        color: #6b7280 !important;

        margin-bottom: 0.5rem;

        font-weight: 600;

    }

}


@media (max-width: 992px) {

    body { padding: 0.5rem; background: #f9fafb; }

    .container { padding-left: 0; padding-right: 0; }

    .card { border: none; box-shadow: none; background: transparent; }

    .card-body { padding: 0.5rem; }

    .section-title { font-size: 1.1rem; margin-bottom: 1rem !important; }

    
    /* Esconder debug em mobile */

    #debugArea { display: none !important; }

    
    /* Formulário mais limpo */

    .form-label { font-size: 0.875rem; margin-bottom: 0.4rem; font-weight: 600; }

    .form-control, .form-select { font-size: 0.9rem; padding: 0.6rem 0.75rem; }

    .mb-3 { margin-bottom: 0.75rem !important; }

    
    /* Busca inteligente compacta */

    .card.border.bg-light { border-radius: 12px !important; margin-bottom: 0.75rem !important; }

    .card.border.bg-light .card-body { padding: 0.75rem !important; }

}

    
@media (max-width: 768px) {

    body { padding: 0.5rem; }

    .container { padding-left: 0; padding-right: 0; }

    .card-body { padding: 0.5rem; }

    .nav-top { flex-direction: row; align-items: center; gap: 0.35rem; padding: 0.5rem 0.7rem !important; }

    .photo-thumb { height: clamp(120px, 30vw, 160px); }

    #listaAlbuns .card-body { gap: 0.5rem; }

    .input-group { flex-wrap: wrap; }

    .input-group > .form-control { min-width: 180px; }


    .nav-top .btn, .nav-top a.btn {

        width: auto;

        justify-content: center;

        padding: 0.3rem 0.6rem;

        font-size: 0.82rem;

    }

    .nav-top .btn i { margin-right: 0.35rem; }

    .nav-top .d-flex { flex-wrap: nowrap; }

    .nav-top .d-flex:last-child { width: auto; }

    .nav-top .fw-bold { font-size: 0.95rem; }


    #filtroAlbuns { min-width: 100%; }

    #statusAlbuns { max-width: 100% !important; }


    .busca-albuns-group {

        max-width: 260px;

        flex: 1 1 auto;

        flex-wrap: nowrap;

    }


    #albumAtualInfo { width: 100%; justify-content: flex-start; }

    #albumAtualInfo .btn { flex: 1 1 auto; }

}


@media (max-width: 576px) {

    body { padding: 0.5rem; }

    .card-body { padding: 0.9rem; }

    .btn.w-100 { font-weight: 600; }

    #albumAtualInfo { flex-wrap: wrap; gap: 0.5rem; }

    #albumAtualNome { max-width: 100%; white-space: normal; }


    .section-title { font-size: 0.98rem; }

    .form-label { font-size: 0.92rem; }


    .input-group > .form-control { min-width: 0; }

    #listaAlbuns { --bs-gutter-x: 0.6rem; --bs-gutter-y: 0.6rem; }

    #listaFotos { --bs-gutter-x: 0.6rem; --bs-gutter-y: 0.6rem; }


    .photo-thumb { height: clamp(120px, 36vw, 170px); }

    .selected-thumb { height: clamp(82px, 22vw, 120px); }

}

    
/* Estilos da Busca Inteligente */

.result-card-item { cursor: pointer; transition: background-color 0.2s; border-bottom: 1px solid #eee; }

.result-card-item:hover { background-color: #f8f9fa; }

.source-badge { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; padding: 2px 6px; border-radius: 4px; }

.bg-local { background-color: #d1fae5; color: #065f46; }

.bg-ml { background-color: #fffbeb; color: #92400e; }

.bg-web { background-color: #eff6ff; color: #1e40af; }