@font-face{
  font-family: "Agency"; 
  src: url("fonts/montserrat.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap; 
}
@font-face{
  font-family: "AgencyBold";
  src: url("fonts/montserrat.ttf") format("truetype");
  font-weight: 700;             /* usato da <strong>/<b> e da font-weight:700 */
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Rufy";
  src: url("fonts/OP2.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root[data-theme='light']{
    --bg: #f6f7fb;
    --bg-2: #eef1fb;
    --panel: #ffffff;
    --text: #0d1022; --text2: #000; --text3: #fff;
    --muted: #4b5778;
    --muted2: #b2bfe5;
    --muted3: #9fb0d1;
    --neon-gold: #fcd992;
    --neon-pink: #ff3af2;
    --neon-cyan: #00e5ff;
    --neon-lime: #b6ff00;
    --neon-purple: #8a2be2;
    --outline: rgba(0,0,0,.9);
    --radius: 16px;
    --radius-sm: 12px;
    --maxw: 1200px;
    --shadow-neon: 0 0 .6rem var(--neon-gold), 0 0 1.25rem rgba(213,175,99,.55), 0 0 2rem rgba(222,184,110,.25);
    --gradient: radial-gradient(1200px 600px at 10% -10%, rgba(222,184,110,.08), transparent 60%),
                radial-gradient(800px 400px at 110% 10%, rgba(210,165,76,.10), transparent 60%),
                radial-gradient(600px 300px at 50% 120%, rgba(182,255,0,.08), transparent 60%);
                

}
    
:root{
      --bg: #0b1a24;
      --bg-2: #0e1430;
      --panel: #0f1a2f;
      --text: #eaf2ff;
      --text2: #fff;
      --text3: #000;
      --muted: #9fb0d1;
      --muted2: #b2bfe5;
      --muted3: #9fb0d1;
      --neon-gold: #d0a44c;
      --neon-pink: #ff3af2;
      --neon-cyan: #00e5ff;
      --neon-lime: #b6ff00;
      --neon-purple: #8a2be2;
      --outline: rgba(210,165,76, 0.35);
      --radius: 16px;
      --radius-sm: 12px;
      --maxw: 1200px;
      --shadow-neon: 0 0 .6rem var(--neon-gold), 0 0 1.25rem rgba(213,175,99,.55), 0 0 2rem rgba(222,184,110,.25);
      --gradient: radial-gradient(1200px 600px at 0% 25%, rgba(222,184,110,.12), transparent 60%),
                  radial-gradient(800px 400px at 26% 75%, rgba(210,165,76,.12), transparent 60%),
                  radial-gradient(600px 300px at 76% 100%, rgba(182,255,0,.10), transparent 60%);
}



    .fa-solid, .fa-brands { color:var(--neon-gold) !important;  text-shadow: 0 0 8px rgba(210,165,76,.6);  }
    .fa-lock-open, .fa-times, .fa-trash-can { color:red !important;  text-shadow: 0 0 8px rgba(210,165,76,.6);  }
    .fa-trash-can { cursor:pointer; }
    
    .fa-crown { color:yellow !important;  text-shadow: 0 0 8px rgba(210,165,76,.6);  }
    
    .fa-heart { color:var(--muted) !important;  text-shadow: 0 0 8px rgba(210,165,76,.6); cursor:pointer;  }
    
    .fagold { color:var(--neon-gold) !important; }
    
    .userboard { width:100%; text-align:center; 
        background-image:  linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
        border-radius:25px; padding:25px; font-family:Agency; 
    }
    .userboard td { width:25%; font-weight:bold; }
    
    .userboard td a { color:var(--neon-gold); text-decoration:underline; }
    
    .userboard_mobile { display:none; width:100%; text-align:center; 
        background-image:  linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
        border-radius:25px; padding:5px; font-family:Agency; 
    }
    .userboard_mobile td { width:50%; font-weight:bold; }
    
    .userboard_mobile td a { color:var(--neon-gold); text-decoration:underline; }
    
    
    #today_rates br { display:none; } #u_sym { display:inline-block; }
    
    .hero .fa-solid { color:var(--neon-gold) !important; }
    
    #userForm, #purchasedList, #cartEmptyMobile { display:none; }
    

    
    /* ====== Base ====== */
    *{ box-sizing:border-box }
    html, body{ height:100% }
    body{
      margin:0;
      font-family: Agency, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Noto Color Emoji', sans-serif;
      background: linear-gradient(90deg, var(--bg), var(--bg-2)) !important; 
      bbackground-image: var(--gradient);
      color: var(--text);
      line-height:1.6;
    }
    small { font-family: Agency; font-size:28px; text-align:center; width:100%; text-transform:uppercase !important;}
    
    .p_desc { font-family: Agency;   font-size:30px; text-transform:uppercase !important; margin:0;}
    .infoline { font-size:24px; padding:25px; text-align:center;}

    
    .thisForm {
        display: inline-block;
        justify-content: center; /* orizzontale */
        align-items: center;     /* verticale */
        text-align: center;
        width:100%;
        
    }
    .thisForm input[type="text"], .thisForm input[type="password"], .thisForm select, .thisForm input[type="submit"], .thisForm input[type="button"] {
        height:60px; width:30%; margin-top:15px; 
    }
    .thisForm input[type="submit"], .thisForm input[type="button"] {
        margin-bottom:15px; color: var(--text2) !important;
    }
    .thisForm input[type="checkbox"] {
        height:50px; width:50px;   
    }
    .thisForm span {
    display: inline-flex; margin-top:15px;
    align-items: center;
    gap: 10px;

    font-family:  Agency;
    font-size: 40px;
    line-height: 1; /* importante */
    }
    
    .card { background-image: linear-gradient(45deg, #0a0e1a, #0e1430); }
    .lang { color:#fff !important; background:#0e1430 !important; font-family: AgencyBold; font-size:14px; }
    .label { color:var(--text2);font-family: AgencyBold; font-size:14px; letter-spacing:2px; }
    #mobile-drawer { font-family: Agency; font-size:18px; }
    #q-header { font-family: AgencyBold; font-size:18px; }
    
    a{ color:inherit; text-decoration:none }
    img{ max-width:100%; display:block }
    .container{ width:100%; max-width: var(--maxw); margin:0 auto; padding: 0 20px; }

    /* ====== Header / Top bar ====== */
    .site-header { position:sticky; top:0; z-index:50; backdrop-filter: blur(25px); border-bottom: 1px solid var(--outline); }
        
    .topbar{ display:flex; align-items:center; gap:16px; min-height:64px; }

    .brand { display:flex; align-items:center; gap:12px; padding:8px 0; }
    .brand .logo { width:32px; height:32px; display:grid; place-items:center; border:1px solid var(--outline); border-radius:10px; box-shadow: var(--shadow-neon); background: linear-gradient(135deg, rgba(222,184,110,.12), rgba(210,165,76,.12)); }
    
    .brand .name { font-size:30px; font-family:  Agency; font-weight:800; letter-spacing:.5px; color: var(--text2);  }
    .brand .name span { color: var(--neon-gold) !important; font-size:32px;  font-family:  Rufy, Agency; font-weight:400; text-shadow: 0 0 8px rgba(222,184,110,.6); }
    

    .spacer{ flex:1 }

    /* User menu (right side) */
    .user-menu{ display:flex; align-items:center; gap:10px; }
    .btn{ cursor:pointer;font-size:24px; font-family: Agency; --pad-x: 14px; --pad-y: 10px; display:inline-flex; justify-content: center; /* orizzontale */
        align-items: center;     /* verticale */
        text-align: center; gap:8px; padding: var(--pad-y) var(--pad-x); border-radius: 999px; border:1px solid var(--outline); 
        text-shadow: 0 0 12px rgba(210,165,76,.8);
        background: rgba(255,255,255,0.02); color: var(--text2); font-weight:600; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
    .btn:hover{ transform: translateY(-1px); box-shadow: var(--shadow-neon); border-color: rgba(210,165,76,.6); }
    .btn.neon{ border-color: rgba(222,184,110,.55); box-shadow: 0 0 .65rem rgba(222,184,110,.55), inset 0 0 .5rem rgba(222,184,110,.15); background: linear-gradient(135deg, rgba(222,184,110,.15), rgba(210,165,76,.10)); }
    .btn.neon2{ border-color: rgba(35,255,10,.55); box-shadow: 0 0 .65rem rgba(35,255,10,.55), inset 0 0 .5rem rgba(35,255,10,.15); background: linear-gradient(135deg, rgba(35,255,10,.15), rgba(35,255,10,.10)); }

    .btn.ghost{ font-size:24px; background: transparent; }
    .btn.neon.pulse{ animation: pulse 2.4s ease-in-out infinite }
    
    .inText{ 
        font-size:30px; 
        font-family: Agency; --pad-x: 14px; --pad-y: 10px; 
        display:inline-flex; justify-content: center; /* orizzontale */
        align-items: center;     /* verticale */
        text-align: center; gap:8px; padding: var(--pad-y) var(--pad-x); 
        border-radius: 999px; border:1px solid var(--outline); 
        background: rgba(110,110,100,0.02); 
        color:var(--neon-gold) !important;
        font-weight:600; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; }

    .nav-toggle{ display:none; background:transparent; border:1px solid var(--outline); color:var(--neon-gold); padding:10px 12px; border-radius:10px; }

    /* ====== Secondary nav / filters ====== */
    .toolbar{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin: 14px 0 26px; }
    .chip{ display:inline-flex; margin-left:3px; align-items:center; gap:8px; padding: 8px 12px; border-radius: 999px; border: 1px solid var(--outline); background: rgba(255,255,255,.02); cursor:pointer; user-select:none; }
    .chip[data-active="true"]{ border:2px dashed var(--neon-gold); box-shadow: 0 0 .5rem rgba(210,165,76,.45); }
    
    .chip2{ display:inline-flex; align-items:center; gap:8px; padding: 8px 12px; border-radius: 999px; border: 1px solid var(--outline); background: rgba(255,255,255,.02); cursor:pointer; user-select:none; }
    .chip2[data-active="true"]{ border-color: rgba(247,10,183,.65); box-shadow: 0 0 .5rem rgba(247,10,183,.45); }
    
    .search{ position:relative; flex:1 1 280px; min-width:220px; }
    .search input{ width:100%; height:44px; padding: 10px 14px 10px 44px; border-radius: 12px; border:1px solid var(--outline); background: rgba(255,255,255,.02); color: var(--text); }
    .search svg{ position:absolute; top:50%; left:16px; transform:translateY(-50%); width:18px; height:18px; opacity:.8; pointer-events:none; }

    /* ====== Hero ====== */
    .hero{ display:grid; gap:12px; padding: 22px; margin-top: clamp(14px, 2.5vh, 32px); border:1px solid var(--outline); border-radius: var(--radius); 
        background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), 
        linear-gradient(to left, rgba(210, 175, 76, 0.5), rgba(0, 0, 0, 0.5), rgba(210, 175, 76, 0.5)), url("imgs/the_cove.webp");
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover; 
        color:var(--text2);
        
    }
    .hero h1{ font-family: Agency; }
    .hero p{ margin:0; color: var(--muted); width:100%; text-align:center; }
    .hero h3,.hero h2{ font-family: Agency; margin:0; color: var(--text-2); width:100%; text-align:center; }
    
    .i_tem{ 
    margin-top: clamp(14px, 2.5vh, 32px); height:650px;
    border:1px solid var(--outline); 
    border-radius: var(--radius); 
        background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), 
        linear-gradient(to left, rgba(210, 175, 76, 0.5), rgba(0, 0, 0, 0.5), rgba(210, 175, 76, 0.5)), url("imgs/the_cove.webp");
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover; 
        color:var(--text2); min-width:100%;
    }
    .i_title { width:100%; min-width:100%; height:10%; margin:0; line-height:10%; vertical-align:middle;  }
    
    .i_tem h1{ font-family: Agency; }
    .i_tem p{ margin:0; color: var(--muted); width:100%; }
    .i_tem h3,.hero h2{ font-family: Agency; margin:0; color: var(--text-2); width:100%; text-align:center; }
    
    .i_left { justify-content:center; text-align:center; display:grid; width:50%; max-width:50%; float:left; max-height: 650px !important; height:650px !important; overflow-y:hidden; overflow-x:hidden; }
    
    
    
    .i_left p { width:100% !important; justify-content:center; }
    
    .thumbs  { width:80% !important; height:80px; max-height:80px;  margin:0; display:flex; }

    .thumbs img { max-width:40px; height:60px; max-height:60px; margin-right:2px; border-radius:5px; }
    
    .i_left p #first { margin-top:15px; justify-content:center; text-align:center; height:460px !important; max-height:460px !important; border-radius:15px; }
    
    .i_right { width:50%; max-width:50%; float:left; height:650px !important; }
    .i_right p b { color :var(--text2); }
    
    .i_right h2 #fav_count { font-size:0.6em !important; vertical-align:middle; }
    
    .i_price b {
        color:var(--text2);
        font-size:1.35em;
    }
    ._price #currency {
        color:var(--text);
    }

    /* ====== Cards grid ====== */
.grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 18px;
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border-radius: var(--radius-sm);
    border: 1px solid var(--outline);
    background: linear-gradient(135deg, rgba(222,184,110,.06), rgba(210,165,76,.06));
}

.card-media {
    position: relative;
    width: 100%;
    background: var(--bg);
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-media > a {
    display: block;
    width: 100%;
    text-align: center;
}

.card-media img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}


    .card::before{ content:""; position:absolute; inset: -1px; border-radius:inherit; padding:1px; background: linear-gradient(130deg, rgba(210,165,76,.6), rgba(222,184,110,.6), rgba(182,255,0,.6)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity:.35; pointer-events:none; }

    .badge{ color:#fff; position:absolute; top:10px; left:10px; padding:6px 10px; font-size:.75rem; letter-spacing:.4px; border-radius:999px; border:1px solid var(--outline); background: rgba(0,0,0,.35); backdrop-filter: blur(4px); }
    .badge.live{ border-color: rgba(182,255,0,.6); box-shadow: 0 0 .5rem rgba(182,255,0,.5); }
    .badge.upcoming{ border-color: rgba(210,165,76,.6); }
    .badge.ended{ border-color: rgba(222,184,110,.6); opacity:.8 }
    
    .favspan{ color:var(--muted2); position:absolute; top:10px; right:10px; padding:6px 10px; font-size:.75rem; letter-spacing:.4px; border-radius:999px; background: rgba(0,0,0,.75); backdrop-filter: blur(4px); }
    .favspan.live{ box-shadow: 0 0 .5rem rgba(182,255,0,.1); }

    .card-body{ display:grid; gap:10px; padding: 14px; }
    .card h2{ margin:0; font-size: 1.4rem; font-family:Agency; }
    .excerpt{ color: var(--muted); font-size:.85rem;  }
    .meta{ display:flex; flex-wrap:wrap; gap:10px; list-style:none; margin:0; padding:0; color: var(--muted); font-size:.75rem }
    .meta li{ display:inline-flex; align-items:center; gap:6px; }
    .actions{ margin-top:6px; display:flex; gap:8px; }

    .tag{ padding:5px 10px; border-radius:999px; border:1px dashed rgba(255,255,255,.15); font-size:.70rem; }

    /* ====== Footer ====== */
    footer{ margin: 0px 0 0px; margin-top:25px !important; color: var(--text2); border-top:1px solid var(--outline); padding-top:16px; 
        width:100% !important; 
        /*background-image: url("imgs/hkcy2.webp");
        background-repeat: no-repeat;
        background-position: center top;
        background-attachment: fixed; 
        background-size: cover;*/
        
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    }
    footer p i { margin-left:15px;margin-right:15px; }
    footer p a { text-decoration:underline; color:var(--neon-gold); }
    
    footer p { width:100%;         
        justify-content: center; /* orizzontale */
        align-items: center;     /* verticale */
        text-align: center; }
    footer img {
        display: block;
        margin: 10px auto;
        max-width: 300px;
        width: 100%;
    }
    
    

    .admin input[type="text"],.admin input[type="number"] {
        width:75%; border:0;
        height:30px;
        font-family:Arial; font-size:16px;
        border-bottom-left-radius:10px;
        border-top-left-radius:10px;
    }
    .admin input[type="button"] {
        width:20%; 
        background-color:var(--neon-gold); color:var(--text2); border:0;
        height:30px;
        font-family:Arial; font-size:16px;
        border-bottom-right-radius:10px;
        border-top-right-radius:10px;
        cursor:pointer;
    }
    
    .admin textarea {
        width:75%; border:0;
        height:80px;
        font-family:Arial; font-size:14px; 
        border-bottom-left-radius:10px;
        border-top-left-radius:10px;
    }
    .admin input[type="submit"] {
        width:20%; 
        background-color:var(--neon-gold); color:var(--text2); border:0;
        height:80px;
        font-family:Arial; font-size:16px; 
        border-bottom-right-radius:10px;
        border-top-right-radius:10px;
        cursor:pointer;
    }
    
    .admin p { height:auto; vertical-align:middle; }
    .admin textarea,
    .admin input[type="submit"]{
        box-sizing:border-box;
        margin:0;
        vertical-align:top;
    }
    
    hr{
        width:100%;
        border:none;
        border-top:4px dashed var(--neon-gold);
        box-shadow:0 0 10px var(--neon-gold);
        margin:20px 0;
    }
    
    .admin_banners {
        width:95%;
    }
    .admin_banners td {
        text-align:center;
    }
    
    .admin_banners .banner_image {
        width:40%; height:80px; overflow:hidden;
    }
    
    .admin_banners #banner_text {
        width:30%; height:80px; overflow:hidden;
    }
    
    .admin_banners #banner_update {
        width:25%; height:80px; overflow:hidden;
    }
    .admin_banners #banner_update input[type="button"] {
        width:80% !important; 
        background-color:var(--neon-gold); color:var(--text2); border:0;
        height:40px;
        font-family:Arial; font-size:16px; 
        border-radius:10px  !important; 
        cursor:pointer;
    }
    
    .admin_banners .banner_image input[type="button"] {
        width:80% !important; 
        background-color:var(--neon-gold); color:var(--text2); border:0;
        height:40px;
        font-family:Arial; font-size:16px; 
        border-radius:10px  !important; 
        cursor:pointer;
    }
    

    
    .admin_banners #banner_text textarea {
        width:100%; height:120px; 
        border-radius:0px !important;
    }
    .admin_banners .banner_image img {
        width:100%; height:120px;
    }
    .admin_banners #banner_set {
        width:5%; height:80px;
    }
    .admin_banners #banner_set input[type="checkbox"] { width:30px;height:30px; cursor:pointer; }
    

    .admin_ship {
        width:100%;
    }
    .admin_ship td {
        text-align:center;
    }
    
    .admin_ship tr {
        height:30px;
    }
    .admin_ship tr:nth-child(even){
        background-color:#1a1a1a;
    }

    .admin_ship tr:nth-child(odd){
        background-color:#2a2a2a;
    }
    
    .admin_ship #ship_del { cursor:pointer; }
    
    #ships_desc { color:var(--neon-gold); }
    
    
    .ship_edit_tr { display:none; }
    
    .ship_edit_tr input { border-radius:10px; width:20% !important; text-align:center; }
    
    .w_remove { display:inline-block; }

    .admin_list {
        width:100%;
    }
    .admin_list td {
        text-align:center; justify-content:center;
        width:20%; overflow:hidden;
    }
    .admin_list td img { height:100px; width:100%; }
    
    .admin_list tr {
        height:60px;
    }
    .admin_list tr:nth-child(even){
        background-color:#1a1a1a;
    }

    .admin_list tr:nth-child(odd){
        background-color:#2a2a2a;
    }
    
    
    
    
    
    
    

    .admin_cats {
        width:100%;
    }
    .admin_cats td {
        text-align:center;
    }
    
    .admin_cats tr {
        height:30px;
    }
    .admin_cats tr:nth-child(even){
        background-color:#1a1a1a;
    }

    .admin_cats tr:nth-child(odd){
        background-color:#2a2a2a;
    }
    .admin_cats #cat_id{ width:10%; }
    
    .admin_cats #cat_name{ width:30%; }
    
    .admin_cats #cat_desc{ width:50%; }
    
    .admin_cats #cat_del{ width:10%; cursor:pointer; }
    
    #cats_desc { color:var(--neon-gold); }
    
    .new_cat {
        width:95%;padding-left:2.5%;
    }
    
    .new_cat #cat_name_new { width:30%; border-right:1px solid;}
    .new_cat #cat_desc_new { width:50%; border-radius:0 !important; border-right:1px solid; }
    .new_cat #cat_add { width:20%; }
    
    .new_cat input { margin:0; }
    
    .nav_active { border:2px dashed var(--neon-gold);  }
    .subnav_active {  background-color:lightgreen !important; }
    
    
.item_manage { display:none; }

.item_manage input[type="text"]{
    width:90%;
    font-family:Agency;
    border-radius:15px;
    text-align:center;
    height:45px;
}
.item_manage input[type="number"], .item_manage select  {
    width:25%;
    font-family:Agency;
    border-radius:15px;
    text-align:center;
    height:45px;
}
.item_manage input[type="button"] {
    width:25%; height:45px;
    font-family:Agency;
    border-radius:15px;
    text-align:center;
}

.item_manage #btn_update {     background-color:green; color:var(--text2); }
.item_manage #btn_delete {     background-color:red; color:var(--text2); }
.item_manage #btn_cancel {     background-color:gray; color:var(--text2); }


.admin_items {
    width:100%;
    height:40px;
    margin:0;
    padding:0;
    display:flex;
}

.admin_items p{
    margin:0;
    padding:0;
}

.admin_items p span{
    display:inline-flex;
    align-items:center;
    height:40px;
    padding:0 10px;
    margin:0 2px 0 0;
    background-color:var(--neon-gold);
    color:var(--text2);
    border-top-left-radius:15px;
    border-top-right-radius:15px;
}

.items_panel{
    margin:0;
    padding:0;
    background-color:#2a455c;
    width:100%;
    height:500px;
    overflow-y:scroll;
    color:var(--text2);
}
    .item_add select,.item_add input[type="text"],.item_add input[type="number"],.item_add textarea {
        height:60px; width:96%; margin-left:2%; margin-top:5px; border-radius:0px;
        font-family: Agency; font-size:28px; border:0 !important;
    }
    .item_add textarea {
        height:80px !important; 
    }
    
    .item_add #item_pics {
        height:auto; margin-top:5px; width:96%; margin-left:2%; border:2px dashed var(--neon-gold);
        vertical-align:middle; text-align:center;
        align-items:center; justify-content:center; padding:10px;
    }
    .item_add #pics_preview {    display: none;    flex-wrap: nowrap;    gap: 5px;    width: 100%;    height: 90px;    overflow-x: auto;    overflow-y: hidden;    padding-bottom: 15px;}
    .item_add #pics_preview img {    height: 75px;    flex-shrink: 0;    border-radius: 5px;    object-fit: cover;}


    .item_add #upload_imgs_cancel { display:none; }
    .item_add div input[type="button"] {
        font-size:26px; font-family: Agency;  margin:10px;
        border-radius: 25px; border:1px solid var(--outline); 
        background: rgba(255,255,255,0.02); color: var(--muted); font-weight:600; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; 
        height:40px !important; width:80% !important;
    }
    .item_add div input[type="button"]:hover{ transform: translateY(-1px); box-shadow: var(--shadow-neon); border-color: rgba(210,165,76,.6); }
    
    
    .item_add div input[type="file"] {
        font-size:26px; font-family: Agency;  margin:10px;
        border-radius: 25px; border:1px solid var(--outline); 
        background: rgba(255,255,255,0.02); color: var(--muted); font-weight:600; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; 
        height:40px !important; width:80% !important;
    }
    .item_add div input[type="file"]:hover{ transform: translateY(-1px); box-shadow: var(--shadow-neon); border-color: rgba(210,165,76,.6); }
    
    
    .item_add input[type="submit"], .item_add input[type="button"] {
        height:60px; width:96%; margin-left:2%; margin-top:5px; border-radius:0px;
        font-family: Agency; font-size:28px; border:0 !important;
    }
    
    #ships_desc { color:var(--neon-gold); }
    
    .color_back { padding-left:5%; padding-top:15px; padding-bottom:15px;width:100%; background-color:#2a455c; color:var(--text2); border-radius:30px;  }
    
    .palace {
        text-shadow: 0 0 8px rgba(210,165,76,.6);
        /*background: -webkit-linear-gradient(-45deg, rgba(209, 164, 75, 1)25%, rgba(213, 175, 99, 1));
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;*/
    }
    
    .new_ship {
        width:95%; padding-left:2.5%;
    }
    
    .new_ship #ship_zone { width:20%; border-right:1px solid; }
    .new_ship #ship_name_new { width:20%; border-right:1px solid; }
    .new_ship #ship_weight_new { width:20%; border-radius:0 !important; border-right:1px solid; }
    .new_ship #ship_cost_new { width:20%; border-radius:0 !important; border-right:1px solid; }
    .new_ship #ship_add { width:20%; }
    .new_ship input,.new_ship select { margin:0; }
    
        .new_ship select {
        
        height:30px;
        font-family:Arial; font-size:16px;

    }
    
    .user_notice {
        z-index:25;
        bottom:35%;
        left:25%;
        width:50%;
        height:30%;
        border-radius:15px;
        display:none;
        
        background: rgba(11,26,36,0.9); 
        border:2px solid var(--neon-gold);
        position:fixed;
        
        
        font-size:24px; font-family: Agency; --pad-x: 14px; --pad-y: 10px;
        justify-content: center; /* orizzontale */
        align-items: center;     /* verticale */
        text-align: center; gap:8px; padding: var(--pad-y) var(--pad-x); 
        text-shadow: 0 0 12px rgba(210,165,76,.8);
        color: var(--text2);
        font-weight:600; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
        animation: expandFromCenter 0.1s ease-out forwards;
        box-shadow: var(--shadow-neon); 
    }
    
    :root[data-theme="light"] .user_notice   {

        background: rgba(255,255,255,0.9); 
        border:2px solid var(--text2);

        text-shadow: 0 0 12px rgba(210,165,76,.8);
        color: var(--text2);
        box-shadow: var(--shadow-neon); 
    }
    
    .cart_div {
        z-index:25;
        bottom:15px;
        left:2%;
        width:96%;
        
        border-radius:15px;
        display:none;
        
        background: rgba(11,26,36,0.8); 
        border:2px solid var(--neon-gold);
        position:fixed;
        
        cursor:pointer;
        font-size:24px; font-family: Agency; --pad-x: 14px; --pad-y: 10px;
        justify-content: center; /* orizzontale */
        align-items: center;     /* verticale */
        text-align: center; gap:8px; padding: var(--pad-y) var(--pad-x); 
        text-shadow: 0 0 12px rgba(210,165,76,.8);
        color: var(--text2); font-weight:600; transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
        animation: expandFromCenter 0.9s ease-out forwards;
        box-shadow: var(--shadow-neon); 
    }
    :root[data-theme="light"] .cart_div { background: rgba(246, 247, 251,0.9); border:2px solid var(--text2);  color: var(--text2); }
    
    .cart_table {
        width:100%;
    }
    .cart_table tr:nth-child(even){
        background-color:rgba(33,33,33,.7);
    }
    
    :root[data-theme="light"] .cart_table tr:nth-child(even){
        background-color:rgba(255,255,255,.7);
    }

    .cart_table tr:nth-child(odd){
        background-color:rgba(75,75,75,.7);
    }
    
    .cart_table td { width:25%; height:80px; }
    
    .cart_head { height:45px; font-weight:bold; background-color:var(--neon-gold) !important; }
    
    .cart_img { text-align:center !important; justify-content:center !important; }
    
    .cart_img img { max-width:100%; max-height:80px; height:80px; text-align:center !important; justify-content:center !important;  }
    
    .cart_for_mobile { display:none; }
    
    .cart_weight { display:table-row; width:100% !important; }
    
    .cart_weight td { width:50% !important; }
    
    .cart_weight_mobile, .cart_exceed_mobile { display:none; }
    
    .cart_green { background:green  !important; }
    
    .cart_green img { height:40px  !important; max-height:40px  !important; }
    
    .cart_weight_mobile td { width:50% !important; }
    .cart_exceed_mobile td { width:100% !important; }
    
    .cart_address td p { display:none; margin:2%;color:var(--text2); width:96%; height:auto; border-radius:30px; border:6px dashed darkblue; padding:25px; }
    
    .mobile_br, .mobile_fa { display:none; }
    
    
    .smallInput  {
        width:30%; border:0;
        height:30px;
        font-family:Agency;
        border-radius:10px; margin:6px;
    }
    .bigInput  {
        width:60%; border:0;
        height:30px;
        font-family:Agency;
        border-radius:10px; margin:6px;
    }
    
    .cart_address td p input:disabled { background-color:#333333; color:var(--text2); }
    :root[data-theme="light"] .cart_address td p input:disabled { background-color:#aaaaaa; color:var(--text2); }
    
    
.tag_sel{
    height:auto;
    margin-top:5px;
    width:96%;
    margin-left:2%;
    border:2px dashed var(--neon-gold);
    text-align:center;
    padding:10px;
}

.tag_sel p{
    width:100%;
    margin:0;
}

.tag_sel p:last-child{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
    margin-top:10px;
}

.tag_sel p span{
    border:1px dashed var(--neon-gold);
    border-radius:15px;
    padding:10px;
    display:inline-flex;
    align-items:center; cursor:pointer;
}

.scrollable2{
  overflow: auto;                /* or overflow: scroll */
  scrollbar-width: thin;         /* Firefox */
  scrollbar-color: var(--neon-gold) rgba(255,255,255,.08); /* Firefox: thumb track */
  scrollbar-gutter: stable;      /* avoids layout shift when bar appears */
  width:100%;margin:0;padding-bottom:10px;overflow-x:scroll;white-space: nowrap;
}

/* Chromium/Edge/Safari (WebKit) */
.scrollable2::-webkit-scrollbar{
  width: 10px;
  height: 10px;
}
.scrollable2::-webkit-scrollbar-track{
  background: rgba(255,255,255,.08);
  border-radius: 10px;
}
.scrollable2::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, var(--neon-gold), var(--neon-gold));
  border-radius: 10px;
  border: 2px solid transparent;     /* gives “pill” effect */
  background-clip: content-box;
}
.scrollable2::-webkit-scrollbar-thumb:hover{
  background: linear-gradient(180deg, var(--neon-gold), var(--neon-gold));
}
.scrollable2::-webkit-scrollbar-corner { background: transparent; }

    
.scrollable {
  max-height: 140px;
  overflow: auto;                /* or overflow: scroll */
  scrollbar-width: thin;         /* Firefox */
  scrollbar-color: var(--neon-gold) rgba(255,255,255,.08); /* Firefox: thumb track */
  scrollbar-gutter: stable;      /* avoids layout shift when bar appears */
  width:100%;margin:0;padding-bottom:10px;overflow-x:scroll;white-space: nowrap;
}

/* Chromium/Edge/Safari (WebKit) */
.scrollable::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.scrollable::-webkit-scrollbar-track {
  background: rgba(255,255,255,.08);
  border-radius: 10px;
}
.scrollable::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--neon-gold), var(--neon-gold));
  border-radius: 10px;
  border: 2px solid transparent;     /* gives “pill” effect */
  background-clip: content-box;
}
.scrollable::-webkit-scrollbar-thumb:hover{
  background: linear-gradient(180deg, var(--neon-gold), var(--neon-gold));
}
.scrollable::-webkit-scrollbar-corner{ background: transparent; }

.kyl_sel {
    font-size:24px; font-family: Agency; --pad-x: 14px; --pad-y: 10px; display:inline-flex; justify-content: center; /* orizzontale */
    align-items: center;     /* verticale */
    text-align: center; gap:8px;
    padding: var(--pad-y) var(--pad-x); border-radius: 999px; border:1px solid var(--outline); 
    text-shadow: 0 0 12px rgba(210,165,76,.8);
    background: rgba(255,255,255,0.02);
    color: var(--text2);
    font-weight:600;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.kyl_sel option { font-family:Agency !important; color: var(--text3); }

.drawer .kyl_sel { border-radius: 10px !important;  }

.p_guest select {
    font-size:24px; font-family: Agency; --pad-x: 14px; --pad-y: 10px; display:inline-flex; justify-content: center; /* orizzontale */
    align-items: center;     /* verticale */
    text-align: center; gap:8px;
    padding: var(--pad-y) var(--pad-x); border-radius: 999px; border:1px solid var(--outline); 
    text-shadow: 0 0 12px rgba(210,165,76,.8);
    background: rgba(255,255,255,0.02);
    color: var(--text2);
    font-weight:600;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
    width:250px;
}
.p_guest select option { font-family:Agency !important; color: var(--text3); }

.search_form { justify-content:center; height:auto; text-align:center; width:100%; }

.search_form input {
    height:60px; width:46%; margin-left:2%; margin-top:5px; border-radius:25px;
    font-family: Agency; font-size:28px; background: rgba(0,0,0,0.5); border:1px solid var(--neon-gold); !important;
    color:var(--text2);
}

.search_head{
    text-align:center;
    width:100%;
    font-size:24px; 
}
.search_items  { background: rgba(0,0,0,0.5); border:1px solid var(--neon-gold); !important; }


.cookie-box {
    position: fixed;
    left: 20px;
    right: 20px;
    bottom: 10px;
    z-index: 9999;
    display:none;
    background: var(--bg);
    color: var(--text2);
    padding: 20px;
    border-radius: 12px;
    border:3px dashed var(--outline);
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.2);

    font-family: Agency, Arial, sans-serif;
}

.cookie-content {
    max-width: 1000px;
    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.cookie-box p {
    margin: 8px 0 0;
    font-size: 18px;
    line-height: 1.5;
}

.cookie-box button {
    flex-shrink: 0;

    border: 0;
    border-radius: 8px;
    padding: 12px 25px;
    font-family: Agency, Arial, sans-serif;
    color: var(--text3);
    background: var(--text2);

    cursor: pointer;
    font-size: 22px;
}

.cookie-box button:hover {
    opacity: 0.8;
}



:root[data-theme="light"] .search_form input {
    background: rgba(255,255,255,0.8) !important; 
    border:1px solid var(--text2); !important;
}


:root[data-theme="light"] .kyl_sel {    color:var(--text2); }

:root[data-theme="light"] .kyl_sel option {    color:var(--text2); }

:root[data-theme="light"] .p_guest select {    color:var(--text2); }

:root[data-theme="light"] .p_guest select option {    color:var(--text2); }

:root[data-theme="dark"] body {
    background: linear-gradient(90deg, var(--bg), var(--bg-2))
}
:root[data-theme="light"] .items_panel {    color:var(--text3); background-color:#677179; }
:root[data-theme="light"] .color_back {   background-color:#677179; color:var(--text3); }
:root[data-theme="light"] .hero { color:var(--text2) !important; 
  
    background: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)), 
        linear-gradient(to left, rgba(210, 175, 76, 0.5), rgba(255, 255, 255, 0.5), rgba(210, 175, 76, 0.5)), url("imgs/the_cove.webp");
}

:root[data-theme="light"] .i_tem { 
    background: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5)),
        linear-gradient(to left, rgba(210, 175, 76, 0.5), rgba(255, 255, 255, 0.5), rgba(210, 175, 76, 0.5)), url("imgs/the_cove.webp");
    }



:root[data-theme="light"] .hero .btn { color: var(--text2); text-shadow: 0 0 8px rgba(33,33,33,.6) !important; }

/*:root[data-theme="light"] .btn { color: var(--text2); text-shadow: 0 0 8px rgba(33,33,33,.6) !important; }*/

:root[data-theme="light"] .name span { color: var(--text2) !important; text-shadow: 0 0 8px rgba(33,33,33,.6) !important; }

:root[data-theme="light"] .card { background-image: linear-gradient(45deg, #f6f7fb, #eef1fb); }
:root[data-theme="light"] .tag{ padding:5px 10px; border-radius:999px; border:1px dashed rgba(33,33,33,.15); font-size:.70rem; }

:root[data-theme="light"] .hero .fa-solid { color:var(--neon-gold) !important; }

.fav_selected { color:red !important; }
:root[data-theme="light"]  .fav_selected { color:red !important; }
:root[data-theme="light"] .fagold { color:var(--text2) !important; }

:root[data-theme="light"] footer p a { text-decoration:underline; color:var(--text2); }
:root[data-theme="light"] .chip[data-active="true"]{ border:2px dashed var(--text2);  }
:root[data-theme="light"] .nav_active { border:2px dashed var(--text2);  }

:root[data-theme="light"] .nav-toggle { color:var(--text2); }

:root[data-theme="light"] .items_panel .fa-solid { color: var(--text3) !important; }

:root[data-theme="light"] .fa-solid, :root[data-theme="light"] .fa-brands { color:var(--text2) !important;  text-shadow: 0 0 5px rgba(33,33,33,.6);  }
:root[data-theme="light"] .fa-lock-open, :root[data-theme="light"] .fa-times, :root[data-theme="light"] .fa-trash-can { color:red !important;  text-shadow: 0 0 5px rgba(33,33,33,.6);  }
:root[data-theme="light"] .fa-crown { color:yellow !important;  text-shadow: 0 0 5px rgba(33,33,33,.6);  }
:root[data-theme="light"] .fa-heart { color:var(--muted3) !important; }

    @media(prefers-color-scheme: dark) {
        body {    background: linear-gradient(90deg, var(--bg), var(--bg-2)) }
        
        .nav-toggle{ color:var(--text2);  }
        .site-header { backdrop-filter: blur(8px); background: linear-gradient(180deg, rgba(10,14,26,.4), rgba(10,14,26,.0)); border-bottom: 1px solid var(--outline); }

        

        .scrollable::-webkit-scrollbar-thumb{   background: linear-gradient(180deg, #d0a44c, #00a3ff); }
        .scrollable::-webkit-scrollbar-track{  background: rgba(0,0,0,.08); }
        .scrollable{  scrollbar-color: #d0a44c rgba(0,0,0,.08);  }
    }



    /* ====== Responsiveness ====== */
    
    @media (max-width: 1028px){
      .user-menu .label{ display:none }
      
        .user_notice {
            bottom:55%;
            left:15%;
            width:70%;
            height:16%;
            border-radius:15px;
            display:none;
            font-size:24px; 
        }
    }
    
    
    @media (max-width: 860px){
      .user-menu .label{ display:none }
      small { font-size:28px; }
      
        .user_notice {

            bottom:40%;
            left:15%;
            width:70%;
            height:25%;
            border-radius:15px;
            display:none;
            font-size:22px; 
        }
    }
    @media (max-width: 822px){
        .user_notice {
            bottom:40%;
            left:15%;
            width:70%;
            height:20%;
            border-radius:15px;
            display:none;
            font-size:22px; 
        }
    }
    @media (max-height: 368px){
        .user_notice {
            bottom:20%;
            left:15%;
            width:70%;
            height:60%;
            border-radius:15px;
            display:none;
            font-size:22px; 
        }
    }
    @media (max-width: 721px){
        
    .user_notice {

        bottom:35%;
        left:15%;
        width:70%;
        height:30%;
        border-radius:15px;
        display:none;
        font-size:22px; 
    }
        
      .nav-toggle{ display:inline-flex }
      .user-menu{ display:none }
      .drawer{ position:fixed; inset: 64px 0 auto 0; background-color: #0e1430; border-top:1px solid var(--outline); border-bottom:1px solid var(--outline); display:none; }
      .drawer.open{ display:block }
      .drawer .row{ display:flex; flex-direction:column; gap:10px; padding:12px 20px; }
      .drawer a{ padding:10px 12px; border:1px solid var(--outline); border-radius:10px; }

      footer img { width:100%; }
      
        .thisForm input[type="text"], .thisForm input[type="password"], .thisForm select, .thisForm input[type="submit"], .thisForm input[type="button"] {
            height:60px; width:90%; margin-top:15px;
        }
        .thisForm input[type="checkbox"] {
            height:40px; width:40px; margin-top:15px;
        }
        .thisForm span {
            font-size: 28px;
        }
        .infoline { font-size:18px; padding:20px; }
    }
    
    @media (max-height: 269px){
        .user_notice {
            bottom:15%;
            left:15%;
            width:70%;
            height:70%;
            border-radius:15px;
            display:none;
            font-size:22px; 
        }
    }
    
    @media (max-width: 601px){
        #cartEmptyMobile { display:inline; }
    .cookie-content {
        flex-direction: column;
        align-items: stretch;
    }

    .cookie-box button {
        width: 100%;
    }
        .user_notice {
            bottom:35%;
            left:5%;
            width:90%;
            height:30%;
            border-radius:15px;
            display:none;
            font-size:18px; 
        }
        
        .i_left { justify-content:center; text-align:center; display:grid; width:100%; max-width:100%; float:left; max-height: 650px !important; height:650px !important; overflow-y:hidden; overflow-x:hidden; }
    
        .i_right { width:100%; max-width:100%; float:left; height:650px !important; }

        .userboard_mobile{ display:block; }
        .userboard { display:none; }
        
        #today_rates br { display:block; }
        #u_sym { display:none; }
        
        .cart_item_desktop { display:none; }
        .cart_head { width:100%; }
        .cart_table td { width:50%; height:80px; }
        .cart_for_mobile  { display:table-row; width:100% !important; height:80px; }
        .cart_for_mobile td { background:green; width:100% !important; height:80px; text-align:center !important; justify-content:center !important; }
        .cart_for_mobile td img { height:40px; text-align:center !important; justify-content:center !important;  }
        .cart_weight, .cart_exceed_desktop {  display:none; }
        
        .cart_weight_mobile, .cart_exceed_mobile { font-size:12px; display:table-row; }
        
        .w_remove { display:none; }
        .ship_edit_tr input { border-radius:10px; width:80% !important; text-align:center; }

        .search_form input {
            height:60px; width:90%; font-size:16px; 
        }
    }

    @media(max-width: 432px){
        
        .cookie-box p {    font-size: 15px;}

        .cookie-box button {    font-size: 18px; }
        
        .p_guest select { width:90%; }

        .user_notice {
            bottom:40%;
            left:2%;
            width:96%;
            height:23%;
            border-radius:15px;
            display:none;
            font-size:18px; 
        }
        
    .cart_address td p { display:none; margin:1%;color:var(--text2); width:98%; height:auto; border-radius:25px; border:6px dashed darkblue; padding:20px; }
    
    .mobile_br, .mobile_fa { display:inline-block; }
    
    
    .smallInput  {
        width:90%; border:0;
        height:30px;
        font-family:Agency;
        border-radius:10px; margin:6px;
    }
    .bigInput  {
        width:90%; border:0;
        height:30px;
        font-family:Agency;
        border-radius:10px; margin:6px;
    }
        
        
    }    

@keyframes flicker {
    
  0%, 18%, 22%, 25%, 53%, 57%, 100% {

      text-shadow:
      0 0 2px #fff,
      0 0 5px #fff,
      0 0 10px #fff,
      0 0 15px #0fa,
      0 0 20px #0fa,
      0 0 25px #0fa,
      0 0 30px #0fa,
      0 0 40px #0fa;
  
  }
  
  20%, 24%, 55% {        
      text-shadow: none;
  }    
}

@keyframes expandFromCenter {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes pulse {
      0%,100%{ box-shadow: 0 0 .55rem rgba(210,165,76,.45) }
      50%{ box-shadow: 0 0 1.2rem rgba(222,184,110,.45) }
}