/* GGWP Hotel — Habbo retro-inspired theme */

@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Condensed&family=Varela+Round&display=swap');

:root {
    --ggwp-blue: #0088cc;
    --ggwp-blue-dark: #005a8c;
    --ggwp-blue-nav: #006db3;
    --ggwp-gold: #eeb425;
    --ggwp-gold-dark: #cf9d15;
    --ggwp-green: #4caf50;
    --ggwp-green-dark: #2e7d32;
    --ggwp-panel: #ffffff;
    --ggwp-panel-border: #c5d0d8;
    --ggwp-text: #2c3e50;
    --ggwp-shadow: 0 2px 0 #b8c4ce, 0 4px 12px rgba(0, 40, 80, 0.15);
}

html.ggwp-hotel,
html.ggwp-hotel body {
    font-family: 'Varela Round', 'Ubuntu Condensed', sans-serif !important;
}

html.ggwp-hotel * {
    font-family: inherit;
}

/* ── Background ── */

html.ggwp-hotel .site-bg {
    background:
        linear-gradient(180deg, #87ceeb 0%, #b8dff5 28%, #d4ebf7 55%, #e8f4fa 100%) fixed !important;
    background-size: cover !important;
}

html.ggwp-hotel.app.dark .site-bg {
    background:
        linear-gradient(180deg, #0a1628 0%, #122640 40%, #1a3352 100%) fixed !important;
}

/* ── Header hero ── */

html.ggwp-hotel .header-bg {
    min-height: 220px !important;
    height: auto !important;
    background:
        linear-gradient(180deg, rgba(0, 60, 120, 0.15) 0%, rgba(0, 40, 90, 0.55) 100%),
        url('/assets/images/hotel.png') center 30% / cover no-repeat !important;
    border-bottom: 4px solid var(--ggwp-gold);
    box-shadow: inset 0 -40px 60px rgba(0, 50, 100, 0.35);
}

html.ggwp-hotel .header-bg > .absolute.bg-black\/50 {
    background: linear-gradient(180deg, rgba(0, 88, 140, 0.25) 0%, rgba(0, 40, 80, 0.65) 100%) !important;
}

html.ggwp-hotel .ggwp-hero {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem 1rem 2rem;
    width: 100%;
    max-width: 56rem;
    margin: 0 auto;
}

html.ggwp-hotel .ggwp-hero-logo {
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.45));
    max-height: 72px;
    width: auto;
}

html.ggwp-hotel .ggwp-hero-tagline {
    color: #fff;
    font-size: 1.15rem;
    text-align: center;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
    max-width: 36rem;
    line-height: 1.5;
}

html.ggwp-hotel .ggwp-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.75rem 1.25rem;
    margin-top: 0.25rem;
}

/* ── Habbo-style buttons ── */

html.ggwp-hotel .ggwp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1.75rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border: 2px solid transparent;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
    text-decoration: none;
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.25);
}

html.ggwp-hotel .ggwp-btn:hover {
    transform: translateY(-1px);
    filter: brightness(1.05);
}

html.ggwp-hotel .ggwp-btn:active {
    transform: translateY(1px);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}

html.ggwp-hotel .ggwp-btn-login {
    background: linear-gradient(180deg, #fff 0%, #e8eef2 100%);
    color: var(--ggwp-blue-dark) !important;
    border-color: #fff;
}

html.ggwp-hotel .ggwp-btn-register {
    background: linear-gradient(180deg, #5fd068 0%, var(--ggwp-green) 50%, var(--ggwp-green-dark) 100%);
    color: #fff !important;
    border-color: #81c784;
}

html.ggwp-hotel .ggwp-btn-client {
    background: linear-gradient(180deg, #ffe566 0%, var(--ggwp-gold) 50%, var(--ggwp-gold-dark) 100%);
    color: #3d2e00 !important;
    border-color: #f5d76e;
}

html.ggwp-hotel .ggwp-btn-or {
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.8rem;
    text-transform: uppercase;
    font-weight: 600;
}

/* ── Navigation bar ── */

html.ggwp-hotel nav.bg-white {
    background: linear-gradient(180deg, var(--ggwp-blue) 0%, var(--ggwp-blue-nav) 100%) !important;
    border-bottom: 3px solid var(--ggwp-gold);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

html.ggwp-hotel .nav-item {
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

html.ggwp-hotel .nav-item:hover,
html.ggwp-hotel .nav-item.md\:border-b-\[\#eeb425\]\! {
    border-bottom-color: var(--ggwp-gold) !important;
    color: var(--ggwp-gold) !important;
}

html.ggwp-hotel nav .dropdown-item {
    color: var(--ggwp-text);
}

/* ── Main content area ── */

html.ggwp-hotel #app.bg-gray-100 {
    background: transparent !important;
}

html.ggwp-hotel main .grid > div > div,
html.ggwp-hotel main .grid > div.w-full.flex.flex-col {
    background: var(--ggwp-panel);
    border: 2px solid var(--ggwp-panel-border);
    border-radius: 10px;
    box-shadow: var(--ggwp-shadow);
}

html.ggwp-hotel.app.dark main .grid > div > div,
html.ggwp-hotel.app.dark main .grid > div.w-full.flex.flex-col {
    background: #1e2a38;
    border-color: #3d5166;
}

/* ── Article cards ── */

html.ggwp-hotel .article-image,
html.ggwp-hotel [class*='article'] img {
    border-radius: 6px;
}

html.ggwp-hotel a[href*='article'] .rounded-lg,
html.ggwp-hotel .swiper-slide {
    border: 2px solid var(--ggwp-panel-border);
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

html.ggwp-hotel a[href*='article'] .rounded-lg:hover {
    transform: translateY(-2px);
    box-shadow: var(--ggwp-shadow);
}

/* ── Top header (logged in) ── */

html.ggwp-hotel .max-w-7xl.min-h-\[60px\]:first-child {
    background: linear-gradient(180deg, #1a2a3a 0%, #0f1a24 100%);
    color: #fff;
    border-bottom: 2px solid var(--ggwp-gold);
}

/* ── Footer ── */

html.ggwp-hotel footer {
    background: linear-gradient(180deg, var(--ggwp-blue-dark) 0%, #003d66 100%) !important;
    color: rgba(255, 255, 255, 0.75) !important;
    border-top: 3px solid var(--ggwp-gold);
}

/* ── Online counter bubble ── */

html.ggwp-hotel .header-bg .bg-white.dark\:bg-gray-900 {
    background: rgba(255, 255, 255, 0.95) !important;
    border: 2px solid var(--ggwp-gold);
    font-weight: 700;
    color: var(--ggwp-blue-dark) !important;
}

/* ── Modals / forms ── */

html.ggwp-hotel .swal2-popup {
    border-radius: 10px;
    border: 3px solid var(--ggwp-gold);
}

html.ggwp-hotel input[type='text'],
html.ggwp-hotel input[type='email'],
html.ggwp-hotel input[type='password'] {
    border-radius: 6px !important;
    border: 2px solid var(--ggwp-panel-border) !important;
}

html.ggwp-hotel button[type='submit'].bg-\[\#eeb425\] {
    background: linear-gradient(180deg, #ffe566 0%, var(--ggwp-gold) 100%) !important;
    color: #3d2e00 !important;
    font-weight: 700;
    border: 2px solid var(--ggwp-gold-dark);
    box-shadow: 0 3px 0 var(--ggwp-gold-dark);
}

/* ── Turbolinks bar ── */

html.ggwp-hotel .turbolinks-progress-bar {
    background: var(--ggwp-gold) !important;
    height: 4px;
}

/* ── Hide default kasja branding feel ── */

html.ggwp-hotel .drop-shadow.hover\:scale-105 {
    max-height: 64px;
    width: auto;
}