/*
 * HOTELIA — Système multi-thèmes
 * S'applique via classe sur <body> : skin-gold | skin-ocean | skin-forest
 * Les skins Ace existants (skin-1, skin-2, skin-3, no-skin) restent fonctionnels.
 */

/* ══════════════════════════════════════════════════════════════
   TRANSITIONS — appliquées à tous les éléments structurels
═══════════════════════════════════════════════════════════════ */
.navbar, .sidebar, .nav-list > li > a, .nav-list > li .submenu,
.main-content, .page-content, .page-header, .breadcrumb,
.btn-primary, .btn-info, .btn-success, .widget-header,
.ace-settings-container, .ace-settings-box {
    transition: background-color .3s ease, color .2s ease, border-color .2s ease;
}
/* Page connexion — transitions fluides lors du changement de thème */
.hl-card, .hl-btn-gold, .hl-tab, .hl-logo-sub, .hl-input, .hl-section {
    transition: background .35s ease, background-color .35s ease, color .25s ease,
                border-color .25s ease, box-shadow .25s ease;
}

/* ══════════════════════════════════════════════════════════════
   THÈME : skin-gold  (Noir & Or — Luxe Hôtelier)
   Primary : #c9a84c   Sidebar/Navbar : #0d1b2a
═══════════════════════════════════════════════════════════════ */
.skin-gold { background-color: #050e1a; }

/* Navbar */
.skin-gold .navbar { background: #0d1b2a; border-bottom: 1px solid rgba(201,168,76,.2); }
.skin-gold .navbar .navbar-brand { color: #c9a84c; }
.skin-gold .navbar .navbar-brand small { color: rgba(201,168,76,.75); }
.skin-gold .ace-nav > li.light-blue { background-color: rgba(201,168,76,.15); }
.skin-gold .ace-nav > li > a { color: #c9a84c; }
.skin-gold .ace-nav > li.black { background-color: rgba(201,168,76,.1); }
.skin-gold .ace-nav > li.black > a { color: #e8d4a0; }
.skin-gold .ace-nav > li > a:hover { background-color: rgba(201,168,76,.25); }

/* Sidebar */
.skin-gold .sidebar { background-color: #0d1b2a; border-right: 1px solid rgba(201,168,76,.12); }
.skin-gold .sidebar-shortcuts { background-color: #060f18; border-bottom: 1px solid rgba(201,168,76,.15); }
.skin-gold .nav-list > li { border-color: rgba(201,168,76,.08); }
.skin-gold .nav-list > li > a { background-color: #0d1b2a; color: #a0b4c8; }
.skin-gold .nav-list > li > a .menu-icon { color: #7a95ab; }
.skin-gold .nav-list > li:hover > a { background-color: #142435; color: #d4c4a0; }
.skin-gold .nav-list > li:hover > a .menu-icon { color: #c9a84c; }
.skin-gold .nav-list > li.open > a, .skin-gold .nav-list > li.open:hover > a { background-color: #0d1b2a; color: #c9a84c; }
.skin-gold .nav-list > li.active > a, .skin-gold .nav-list > li.active:hover > a { background-color: #060f18; color: #c9a84c; }
.skin-gold .nav-list > li.active > a .menu-icon { color: #c9a84c; }
.skin-gold .nav-list > li:hover::before { background-color: #c9a84c; }
.skin-gold .nav-list > li.active::before { display: block; background-color: #c9a84c; }
.skin-gold .nav-list li.active > a::after { border-right-color: #c9a84c; }

/* Submenu */
.skin-gold .nav-list > li .submenu { background-color: #091422; border-top-color: rgba(201,168,76,.1); }
.skin-gold .nav-list > li.active .submenu { background-color: #060f18; }
.skin-gold .nav-list > li .submenu > li > a { border-top-color: rgba(201,168,76,.07); background-color: #091422; color: #8da5ba; }
.skin-gold .nav-list > li .submenu > li > a:hover { background-color: #0f2035; color: #c9a84c; }
.skin-gold .nav-list > li.active .submenu > li > a { background-color: #060f18; }
.skin-gold .nav-list > li.active .submenu > li > a:hover { background-color: #050d15; }
.skin-gold .nav-list > li > .submenu > li > a { color: #8da5ba; }
.skin-gold .nav-list > li > .submenu > li:hover > a { color: #c9a84c; }
.skin-gold .nav-list > li > .submenu > li.active > a { color: #c9a84c; }
.skin-gold .nav-list > li > .submenu::before,
.skin-gold .nav-list > li > .submenu > li::before { border-color: rgba(201,168,76,.2); }

/* Sidebar toggle */
.skin-gold .sidebar-toggle { background-color: #0d1b2a; border-top-color: rgba(201,168,76,.15); }
.skin-gold .sidebar-toggle::before { border-top-color: rgba(201,168,76,.2); }
.skin-gold .sidebar-toggle .ace-icon { color: #c9a84c; }

/* Boutons */
.skin-gold .btn-primary { background-color: #c9a84c; border-color: #b8973b; color: #0d1b2a; }
.skin-gold .btn-primary:hover { background-color: #dbb95d; border-color: #c9a84c; color: #0d1b2a; }
.skin-gold .btn-info { background-color: #1a5276; border-color: #154360; }

/* Badges & Labels */
.skin-gold .label-primary, .skin-gold .badge-primary { background-color: #c9a84c; color: #0d1b2a; }

/* Widget headers */
.skin-gold .widget-header { border-top-color: #c9a84c; }
.skin-gold .widget-header .widget-title { color: #c9a84c; }

/* Page header */
.skin-gold .page-header h1 { color: #0d1b2a; border-bottom-color: #c9a84c; }
.skin-gold .page-header .page-header-icon { color: #c9a84c; }

/* Breadcrumb */
.skin-gold .breadcrumb > li + li::before { color: #c9a84c; }
.skin-gold .breadcrumb a { color: #c9a84c; }


/* ══════════════════════════════════════════════════════════════
   THÈME : skin-ocean  (Bleu Océan Profond)
   Primary : #1abc9c   Sidebar/Navbar : #0d2440
═══════════════════════════════════════════════════════════════ */
.skin-ocean { background-color: #081628; }

.skin-ocean .navbar { background: #0d2440; border-bottom: 1px solid rgba(26,188,156,.2); }
.skin-ocean .navbar .navbar-brand { color: #1abc9c; }
.skin-ocean .navbar .navbar-brand small { color: rgba(26,188,156,.75); }
.skin-ocean .ace-nav > li.light-blue { background-color: rgba(26,188,156,.15); }
.skin-ocean .ace-nav > li > a { color: #1abc9c; }
.skin-ocean .ace-nav > li.black { background-color: rgba(26,188,156,.1); }
.skin-ocean .ace-nav > li.black > a { color: #a0ddd4; }
.skin-ocean .ace-nav > li > a:hover { background-color: rgba(26,188,156,.25); }

.skin-ocean .sidebar { background-color: #0d2440; border-right: 1px solid rgba(26,188,156,.12); }
.skin-ocean .sidebar-shortcuts { background-color: #081628; border-bottom: 1px solid rgba(26,188,156,.15); }
.skin-ocean .nav-list > li { border-color: rgba(26,188,156,.08); }
.skin-ocean .nav-list > li > a { background-color: #0d2440; color: #8fb0c8; }
.skin-ocean .nav-list > li > a .menu-icon { color: #6a95af; }
.skin-ocean .nav-list > li:hover > a { background-color: #123058; color: #a0ddd4; }
.skin-ocean .nav-list > li:hover > a .menu-icon { color: #1abc9c; }
.skin-ocean .nav-list > li.open > a, .skin-ocean .nav-list > li.open:hover > a { background-color: #0d2440; color: #1abc9c; }
.skin-ocean .nav-list > li.active > a, .skin-ocean .nav-list > li.active:hover > a { background-color: #081628; color: #1abc9c; }
.skin-ocean .nav-list > li.active > a .menu-icon { color: #1abc9c; }
.skin-ocean .nav-list > li:hover::before { background-color: #1abc9c; }
.skin-ocean .nav-list > li.active::before { display: block; background-color: #1abc9c; }
.skin-ocean .nav-list li.active > a::after { border-right-color: #1abc9c; }

.skin-ocean .nav-list > li .submenu { background-color: #0a1e35; border-top-color: rgba(26,188,156,.1); }
.skin-ocean .nav-list > li.active .submenu { background-color: #081628; }
.skin-ocean .nav-list > li .submenu > li > a { border-top-color: rgba(26,188,156,.07); background-color: #0a1e35; color: #7aafca; }
.skin-ocean .nav-list > li .submenu > li > a:hover { background-color: #102845; color: #1abc9c; }
.skin-ocean .nav-list > li > .submenu > li > a { color: #7aafca; }
.skin-ocean .nav-list > li > .submenu > li:hover > a { color: #1abc9c; }
.skin-ocean .nav-list > li > .submenu > li.active > a { color: #1abc9c; }
.skin-ocean .nav-list > li > .submenu::before,
.skin-ocean .nav-list > li > .submenu > li::before { border-color: rgba(26,188,156,.2); }

.skin-ocean .sidebar-toggle { background-color: #0d2440; border-top-color: rgba(26,188,156,.15); }
.skin-ocean .sidebar-toggle .ace-icon { color: #1abc9c; }

.skin-ocean .btn-primary { background-color: #1abc9c; border-color: #16a085; color: #fff; }
.skin-ocean .btn-primary:hover { background-color: #48c9b0; border-color: #1abc9c; }
.skin-ocean .label-primary, .skin-ocean .badge-primary { background-color: #1abc9c; }
.skin-ocean .widget-header { border-top-color: #1abc9c; }
.skin-ocean .widget-header .widget-title { color: #1abc9c; }
.skin-ocean .breadcrumb a { color: #1abc9c; }
.skin-ocean .breadcrumb > li + li::before { color: #1abc9c; }


/* ══════════════════════════════════════════════════════════════
   THÈME : skin-forest  (Vert Forêt / Professionnel)
   Primary : #27ae60   Sidebar/Navbar : #1a2b1e
═══════════════════════════════════════════════════════════════ */
.skin-forest { background-color: #101a12; }

.skin-forest .navbar { background: #1a2b1e; border-bottom: 1px solid rgba(39,174,96,.2); }
.skin-forest .navbar .navbar-brand { color: #27ae60; }
.skin-forest .navbar .navbar-brand small { color: rgba(39,174,96,.75); }
.skin-forest .ace-nav > li.light-blue { background-color: rgba(39,174,96,.15); }
.skin-forest .ace-nav > li > a { color: #27ae60; }
.skin-forest .ace-nav > li.black { background-color: rgba(39,174,96,.1); }
.skin-forest .ace-nav > li.black > a { color: #a9d9b8; }
.skin-forest .ace-nav > li > a:hover { background-color: rgba(39,174,96,.25); }

.skin-forest .sidebar { background-color: #1a2b1e; border-right: 1px solid rgba(39,174,96,.12); }
.skin-forest .sidebar-shortcuts { background-color: #101a12; border-bottom: 1px solid rgba(39,174,96,.15); }
.skin-forest .nav-list > li { border-color: rgba(39,174,96,.08); }
.skin-forest .nav-list > li > a { background-color: #1a2b1e; color: #8dbfa0; }
.skin-forest .nav-list > li > a .menu-icon { color: #6aa080; }
.skin-forest .nav-list > li:hover > a { background-color: #223828; color: #b0d9bc; }
.skin-forest .nav-list > li:hover > a .menu-icon { color: #27ae60; }
.skin-forest .nav-list > li.open > a, .skin-forest .nav-list > li.open:hover > a { background-color: #1a2b1e; color: #27ae60; }
.skin-forest .nav-list > li.active > a, .skin-forest .nav-list > li.active:hover > a { background-color: #101a12; color: #27ae60; }
.skin-forest .nav-list > li.active > a .menu-icon { color: #27ae60; }
.skin-forest .nav-list > li:hover::before { background-color: #27ae60; }
.skin-forest .nav-list > li.active::before { display: block; background-color: #27ae60; }
.skin-forest .nav-list li.active > a::after { border-right-color: #27ae60; }

.skin-forest .nav-list > li .submenu { background-color: #142218; border-top-color: rgba(39,174,96,.1); }
.skin-forest .nav-list > li.active .submenu { background-color: #101a12; }
.skin-forest .nav-list > li .submenu > li > a { border-top-color: rgba(39,174,96,.07); background-color: #142218; color: #70b088; }
.skin-forest .nav-list > li .submenu > li > a:hover { background-color: #1c2e20; color: #27ae60; }
.skin-forest .nav-list > li > .submenu > li > a { color: #70b088; }
.skin-forest .nav-list > li > .submenu > li:hover > a { color: #27ae60; }
.skin-forest .nav-list > li > .submenu > li.active > a { color: #27ae60; }
.skin-forest .nav-list > li > .submenu::before,
.skin-forest .nav-list > li > .submenu > li::before { border-color: rgba(39,174,96,.2); }

.skin-forest .sidebar-toggle { background-color: #1a2b1e; border-top-color: rgba(39,174,96,.15); }
.skin-forest .sidebar-toggle .ace-icon { color: #27ae60; }

.skin-forest .btn-primary { background-color: #27ae60; border-color: #1e8449; color: #fff; }
.skin-forest .btn-primary:hover { background-color: #52be80; border-color: #27ae60; }
.skin-forest .label-primary, .skin-forest .badge-primary { background-color: #27ae60; }
.skin-forest .widget-header { border-top-color: #27ae60; }
.skin-forest .widget-header .widget-title { color: #27ae60; }
.skin-forest .breadcrumb a { color: #27ae60; }
.skin-forest .breadcrumb > li + li::before { color: #27ae60; }


/* ══════════════════════════════════════════════════════════════
   UI SÉLECTEUR DE THÈME (dans le panneau config)
═══════════════════════════════════════════════════════════════ */
.hl-theme-picker {
    padding: 10px 6px;
}
.hl-theme-picker-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #666;
    margin-bottom: 10px;
}
.hl-theme-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.hl-swatch {
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    gap: 4px;
}
.hl-swatch-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 3px solid transparent;
    box-shadow: 0 2px 6px rgba(0,0,0,.2);
    transition: transform .2s, border-color .2s, box-shadow .2s;
    position: relative;
    overflow: hidden;
}
.hl-swatch:hover .hl-swatch-circle { transform: scale(1.12); box-shadow: 0 4px 12px rgba(0,0,0,.35); }
.hl-swatch.active .hl-swatch-circle { border-color: #fff; box-shadow: 0 0 0 2px #555, 0 4px 12px rgba(0,0,0,.35); }
.hl-swatch-label { font-size: 9px; color: #666; text-align: center; font-weight: 600; }
.hl-swatch.active .hl-swatch-label { color: #333; }

/* Couleurs des swatches */
.hl-swatch[data-theme="skin-gold"]   .hl-swatch-circle { background: linear-gradient(135deg, #0d1b2a 50%, #c9a84c 50%); }
.hl-swatch[data-theme="skin-ocean"]  .hl-swatch-circle { background: linear-gradient(135deg, #0d2440 50%, #1abc9c 50%); }
.hl-swatch[data-theme="skin-forest"] .hl-swatch-circle { background: linear-gradient(135deg, #1a2b1e 50%, #27ae60 50%); }
.hl-swatch[data-theme="skin-1"]      .hl-swatch-circle { background: linear-gradient(135deg, #222A2D 50%, #2C6AA0 50%); }
.hl-swatch[data-theme="skin-2"]      .hl-swatch-circle { background: linear-gradient(135deg, #333 50%, #C6487E 50%); }
.hl-swatch[data-theme="skin-3"]      .hl-swatch-circle { background: linear-gradient(135deg, #D0D0D0 50%, #f5f5f5 50%); }
.hl-swatch[data-theme="no-skin"]     .hl-swatch-circle { background: linear-gradient(135deg, #555 50%, #87b87f 50%); }


/* ══════════════════════════════════════════════════════════════
   PAGE CONNEXION (index.php) — Overrides par thème
   Les classes .hl-card, .hl-btn-gold, .hl-tab etc. n'existent
   que sur la page de login, donc ces règles sont sans effet ailleurs.
═══════════════════════════════════════════════════════════════ */

/* skin-ocean */
body.skin-ocean { background: linear-gradient(135deg,#061520 0%,#0d2440 50%,#061a2e 100%); }
body.skin-ocean::before { background: radial-gradient(ellipse 600px 400px at 20% 30%,rgba(26,188,156,.06) 0%,transparent 70%),radial-gradient(ellipse 400px 600px at 80% 70%,rgba(26,188,156,.04) 0%,transparent 70%); }
body.skin-ocean .hl-card { border-color: rgba(26,188,156,.25); }
body.skin-ocean .hl-card::before { background: linear-gradient(90deg,transparent,#1abc9c,#48c9b0,#1abc9c,transparent); }
body.skin-ocean .hl-logo-sub { color: #1abc9c; }
body.skin-ocean .hl-tabs { border-bottom-color: rgba(26,188,156,.15); }
body.skin-ocean .hl-tab.active { color: #1abc9c; border-bottom-color: #1abc9c; }
body.skin-ocean .hl-group label { color: rgba(26,188,156,.7); }
body.skin-ocean .hl-input { border-color: rgba(26,188,156,.18); }
body.skin-ocean .hl-input:focus { border-color: rgba(26,188,156,.55); }
body.skin-ocean .hl-btn-gold { background: linear-gradient(135deg,#1abc9c,#48c9b0); color: #fff; box-shadow: 0 4px 20px rgba(26,188,156,.3); }
body.skin-ocean .hl-btn-gold:hover { background: linear-gradient(135deg,#48c9b0,#1abc9c); box-shadow: 0 6px 28px rgba(26,188,156,.45); }
body.skin-ocean .hl-section { color: rgba(26,188,156,.5); }
body.skin-ocean .hl-section::before, body.skin-ocean .hl-section::after { background: rgba(26,188,156,.15); }

/* skin-forest */
body.skin-forest { background: linear-gradient(135deg,#0a1e0d 0%,#1a2b1e 50%,#0b1a0e 100%); }
body.skin-forest::before { background: radial-gradient(ellipse 600px 400px at 20% 30%,rgba(39,174,96,.06) 0%,transparent 70%),radial-gradient(ellipse 400px 600px at 80% 70%,rgba(39,174,96,.04) 0%,transparent 70%); }
body.skin-forest .hl-card { border-color: rgba(39,174,96,.25); }
body.skin-forest .hl-card::before { background: linear-gradient(90deg,transparent,#27ae60,#52be80,#27ae60,transparent); }
body.skin-forest .hl-logo-sub { color: #27ae60; }
body.skin-forest .hl-tabs { border-bottom-color: rgba(39,174,96,.15); }
body.skin-forest .hl-tab.active { color: #27ae60; border-bottom-color: #27ae60; }
body.skin-forest .hl-group label { color: rgba(39,174,96,.7); }
body.skin-forest .hl-input { border-color: rgba(39,174,96,.18); }
body.skin-forest .hl-input:focus { border-color: rgba(39,174,96,.55); }
body.skin-forest .hl-btn-gold { background: linear-gradient(135deg,#27ae60,#52be80); color: #fff; box-shadow: 0 4px 20px rgba(39,174,96,.3); }
body.skin-forest .hl-btn-gold:hover { background: linear-gradient(135deg,#52be80,#27ae60); box-shadow: 0 6px 28px rgba(39,174,96,.45); }
body.skin-forest .hl-section { color: rgba(39,174,96,.5); }
body.skin-forest .hl-section::before, body.skin-forest .hl-section::after { background: rgba(39,174,96,.15); }

/* skin-1 (Navy) */
body.skin-1 .hl-card { border-color: rgba(44,106,160,.3); }
body.skin-1 .hl-card::before { background: linear-gradient(90deg,transparent,#2C6AA0,#5b9bd5,#2C6AA0,transparent); }
body.skin-1 .hl-logo-sub { color: #5b9bd5; }
body.skin-1 .hl-tabs { border-bottom-color: rgba(44,106,160,.2); }
body.skin-1 .hl-tab.active { color: #5b9bd5; border-bottom-color: #2C6AA0; }
body.skin-1 .hl-group label { color: rgba(91,155,213,.7); }
body.skin-1 .hl-input { border-color: rgba(44,106,160,.22); }
body.skin-1 .hl-input:focus { border-color: rgba(44,106,160,.55); }
body.skin-1 .hl-btn-gold { background: linear-gradient(135deg,#2C6AA0,#5b9bd5); color: #fff; box-shadow: 0 4px 20px rgba(44,106,160,.3); }
body.skin-1 .hl-btn-gold:hover { background: linear-gradient(135deg,#5b9bd5,#2C6AA0); box-shadow: 0 6px 28px rgba(44,106,160,.45); }
body.skin-1 .hl-section { color: rgba(91,155,213,.5); }
body.skin-1 .hl-section::before, body.skin-1 .hl-section::after { background: rgba(44,106,160,.2); }

/* skin-2 (Rose corail) */
body.skin-2 .hl-card { border-color: rgba(198,72,126,.22); }
body.skin-2 .hl-card::before { background: linear-gradient(90deg,transparent,#C6487E,#e07aac,#C6487E,transparent); }
body.skin-2 .hl-logo-sub { color: #C6487E; }
body.skin-2 .hl-tabs { border-bottom-color: rgba(198,72,126,.15); }
body.skin-2 .hl-tab.active { color: #C6487E; border-bottom-color: #C6487E; }
body.skin-2 .hl-group label { color: rgba(198,72,126,.7); }
body.skin-2 .hl-input { border-color: rgba(198,72,126,.2); }
body.skin-2 .hl-input:focus { border-color: rgba(198,72,126,.55); }
body.skin-2 .hl-btn-gold { background: linear-gradient(135deg,#C6487E,#e07aac); color: #fff; box-shadow: 0 4px 20px rgba(198,72,126,.25); }
body.skin-2 .hl-btn-gold:hover { background: linear-gradient(135deg,#e07aac,#C6487E); box-shadow: 0 6px 28px rgba(198,72,126,.4); }
body.skin-2 .hl-section { color: rgba(198,72,126,.5); }
body.skin-2 .hl-section::before, body.skin-2 .hl-section::after { background: rgba(198,72,126,.15); }

/* skin-3 (Interface claire) */
body.skin-3 { background: linear-gradient(135deg,#dde3ef 0%,#e8edf5 50%,#dae0ec 100%); color: #1a1f2e; }
body.skin-3::before { background: radial-gradient(ellipse 600px 400px at 20% 30%,rgba(74,144,217,.07) 0%,transparent 70%),radial-gradient(ellipse 400px 600px at 80% 70%,rgba(74,144,217,.05) 0%,transparent 70%); }
body.skin-3 .hl-card { background: rgba(255,255,255,.92); border-color: rgba(74,144,217,.25); color: #1a1f2e; }
body.skin-3 .hl-card::before { background: linear-gradient(90deg,transparent,#4a90d9,#7ab3e8,#4a90d9,transparent); }
body.skin-3 .hl-logo-sub { color: #4a90d9; }
body.skin-3 .hl-tab { color: rgba(26,31,46,.4); }
body.skin-3 .hl-tabs { border-bottom-color: rgba(74,144,217,.15); }
body.skin-3 .hl-tab.active { color: #4a90d9; border-bottom-color: #4a90d9; }
body.skin-3 .hl-group label { color: rgba(74,144,217,.8); }
body.skin-3 .hl-input { background: rgba(0,0,0,.04); border-color: rgba(74,144,217,.22); color: #1a1f2e; }
body.skin-3 .hl-input::placeholder { color: rgba(26,31,46,.35); }
body.skin-3 .hl-input:focus { border-color: rgba(74,144,217,.6); background: rgba(0,0,0,.02); }
body.skin-3 .hl-btn-gold { background: linear-gradient(135deg,#4a90d9,#7ab3e8); color: #fff; box-shadow: 0 4px 20px rgba(74,144,217,.25); }
body.skin-3 .hl-btn-gold:hover { background: linear-gradient(135deg,#7ab3e8,#4a90d9); box-shadow: 0 6px 28px rgba(74,144,217,.4); }
body.skin-3 .hl-section { color: rgba(74,144,217,.5); }
body.skin-3 .hl-section::before, body.skin-3 .hl-section::after { background: rgba(74,144,217,.15); }
body.skin-3 .hl-footer { color: rgba(26,31,46,.4); }

/* no-skin (Neutre) */
body.no-skin .hl-card { border-color: rgba(180,180,180,.2); }
body.no-skin .hl-card::before { background: linear-gradient(90deg,transparent,#888,#bbb,#888,transparent); }
body.no-skin .hl-logo-sub { color: #aaa; }
body.no-skin .hl-tab.active { color: #999; border-bottom-color: #888; }
body.no-skin .hl-btn-gold { background: linear-gradient(135deg,#555,#888); color: #fff; box-shadow: 0 4px 20px rgba(0,0,0,.2); }
body.no-skin .hl-btn-gold:hover { background: linear-gradient(135deg,#888,#555); }