/* 
 * Ischia Mobile Theme Colors
 * File CSS globale per uniformare i colori di tutto il sito
 * Basato sulla palette blu del logo Ischia Mobile
 */

/* Definizione variabili colore globali */
:root {
    /* Colori principali Ischia Mobile */
    --ischia-primary: #0066cc;
    --ischia-primary-light: #3399ff;
    --ischia-primary-dark: #004499;
    --ischia-sky: #66b3ff;
    --ischia-azure: #e6f2ff;
    --ischia-navy: #003366;
    
    /* Colori secondari e di supporto */
    --ischia-white: #ffffff;
    --ischia-gray-light: #f8f9fa;
    --ischia-gray: #6c757d;
    --ischia-gray-dark: #343a40;
    --ischia-black: #000000;
    
    /* Stati e feedback */
    --ischia-success: #28a745;
    --ischia-danger: #dc3545;
    --ischia-warning: #ffc107;
    --ischia-info: var(--ischia-sky);
}

/* Override del tema NFT/arancione con i colori blu */
body,
body.nft-color {
    --primary-color: var(--ischia-primary) !important;
    --secondary-color: var(--ischia-primary-light) !important;
    --theme-color: var(--ischia-primary) !important;
    --theme-color2: var(--ischia-primary-light) !important;
}

/* Sfondi principali */
.home-section,
.nft-color .home-section {
    background-color: var(--ischia-azure);
}

/* Bottoni principali */
.btn-primary,
.explore-btn,
.theme-btn,
.nft-color .explore-btn {
    background-color: var(--ischia-primary) !important;
    border-color: var(--ischia-primary) !important;
    color: var(--ischia-white) !important;
}

.btn-primary:hover,
.explore-btn:hover,
.theme-btn:hover,
.nft-color .explore-btn:hover {
    background-color: var(--ischia-primary-dark) !important;
    border-color: var(--ischia-primary-dark) !important;
}

/* Link e testi colorati */
a,
.content-color,
.theme-color {
    color: var(--ischia-primary);
}

a:hover,
.content-color:hover {
    color: var(--ischia-primary-dark);
}

/* Header e navigation */
.header-style-6 {
    background: var(--ischia-white) !important;
    box-shadow: 0 2px 8px rgba(0, 102, 204, 0.08) !important;
}

.header-style-6 a[href="javascript:history.back()"] {
    background: var(--ischia-primary) !important;
}

.header-style-6 a[href="javascript:history.back()"]:hover {
    background: var(--ischia-primary-dark) !important;
}

/* Mobile menu e navigation icons */
.mobile-style-9 {
    background: var(--ischia-white) !important;
    border-top: 1px solid var(--ischia-azure);
}

.mobile-style-9 li.active i,
.mobile-style-9 li.active h6 {
    color: var(--ischia-primary) !important;
}

.mobile-style-9 li:hover i,
.mobile-style-9 li:hover h6 {
    color: var(--ischia-primary-light) !important;
}

/* Menu laterale */
.mobile-menu-link i:first-child {
    color: var(--ischia-primary) !important;
}

.mobile-menu-link:hover {
    background: var(--ischia-azure) !important;
    color: var(--ischia-primary) !important;
}

/* Category boxes */
.category-box {
    background: var(--ischia-white);
    border: 1px solid var(--ischia-azure);
}

.category-box:hover {
    background: var(--ischia-azure);
    border-color: var(--ischia-primary-light);
}

.category-box div {
    background: var(--ischia-gray-light);
}

/* Collection boxes */
.notable-collection-box,
.top-collection-box,
.collection-product-box {
    border: 1px solid var(--ischia-azure);
}

.notable-collection-box:hover,
.top-collection-box:hover,
.collection-product-box:hover {
    border-color: var(--ischia-primary);
    box-shadow: 0 5px 20px rgba(0, 102, 204, 0.15);
}

/* Theme setting box */
.theme-setting-box .theme-icon {
    background: var(--ischia-primary) !important;
}

.theme-setting-box .theme-option {
    background: var(--ischia-white);
    border: 1px solid var(--ischia-primary);
}

/* Icone e elementi decorativi */
.ri-home-line,
.ri-search-line,
.ri-shopping-cart-line,
.ri-wallet-3-line,
.ri-user-3-line {
    color: var(--ischia-gray);
}

.mobile-style-9 li.active .ri-home-line,
.mobile-style-9 li.active .ri-search-line,
.mobile-style-9 li.active .ri-shopping-cart-line,
.mobile-style-9 li.active .ri-wallet-3-line,
.mobile-style-9 li.active .ri-user-3-line {
    color: var(--ischia-primary) !important;
}

/* Titoli e headers */
h1, h2, h3, h4, h5, h6 {
    color: var(--ischia-gray-dark);
}

.title-2 h4 {
    color: var(--ischia-primary-dark);
}

/* Dark mode adjustments */
body.dark {
    --ischia-primary: #3399ff;
    --ischia-primary-light: #66b3ff;
    --ischia-primary-dark: #0066cc;
}

body.dark .mobile-menu-sidebar {
    background: #1a1a1a;
}

body.dark .mobile-menu-link:hover {
    background: #2a2a2a;
    color: var(--ischia-primary-light);
}

body.dark .category-box {
    background: #2a2a2a;
    border-color: #333;
}

body.dark .category-box:hover {
    background: #333;
    border-color: var(--ischia-primary);
}

/* Form elements */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
textarea:focus {
    border-color: var(--ischia-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 102, 204, 0.25) !important;
}

/* Badge e notifiche */
.badge-primary,
.verify-image {
    background-color: var(--ischia-primary);
}

/* Scrollbar personalizzata (Chrome, Safari) */
::-webkit-scrollbar-thumb {
    background: var(--ischia-primary);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--ischia-primary-dark);
}

/* Selection color */
::selection {
    background: var(--ischia-primary);
    color: var(--ischia-white);
}

::-moz-selection {
    background: var(--ischia-primary);
    color: var(--ischia-white);
}

/* Override specifici per elementi con !important nel CSS originale */
.nft-color .home-box::before {
    background: linear-gradient(to bottom, transparent, var(--ischia-primary-dark)) !important;
}

/* Loader e animazioni */
.loader,
.spinner {
    border-color: var(--ischia-azure);
    border-top-color: var(--ischia-primary);
}

/* Footer */
.mobile-style-9 p strong {
    color: var(--ischia-primary);
}