/*
Theme Name: Stormy QR Shell
Version: 1.0.1
*/

/* =========================================
   STORMY SAILORS — BRAND LOCK (WITH BULLET FIX)
   ========================================= */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;600;700&family=Inter:wght@400;500;600&display=swap');

:root{
    --stormy-bg: #071427;
    --stormy-panel: #0d1f3a;
    --stormy-gold: #d4af37;
    --stormy-gold-bright: #f5d76e;
    --stormy-text: #e6edf7;
}

/* =========================================
   GLOBAL RESET / BASE
   ========================================= */

*{ box-sizing:border-box; }

body{
    margin:0;
    background: linear-gradient(180deg, #071427 0%, #0b1c35 100%);
    color: var(--stormy-text);
    font-family: 'Inter', sans-serif;
    line-height:1.6;
}

/* Kill stray bullets (your left-side dots) */
ul, ol{
    list-style:none;
    padding-left:0;
    margin-left:0;
}

/* Keep normal content lists readable inside the main panel if you ever want them */
.site-content ul, .site-content ol,
.entry-content ul, .entry-content ol,
main ul, main ol{
    list-style: none; /* keep none to match your aesthetic */
    padding-left: 0;
}

/* =========================================
   HEADER + TAGLINE
   ========================================= */

.stormy-header{
    text-align:center;
    padding:50px 20px 40px 20px;
}

.stormy-tagline{
    margin-top:12px;
    font-size:1.1rem;
    letter-spacing:1.5px;
    opacity:.85;
    font-family: 'Inter', sans-serif;
}

/* =========================================
   NAVIGATION
   ========================================= */

.stormy-nav{
    margin-top:25px;
    text-align:center;
}

.stormy-menu{
    list-style:none;
    padding:0;
    margin:0;
}

.stormy-menu li{
    display:inline-block;
    margin:0 15px;
}

.stormy-menu a{
    color: var(--stormy-gold);
    text-decoration:none;
    font-weight:600;
    font-family:'Oswald', sans-serif;
    letter-spacing:1px;
    text-transform:uppercase;
}

.stormy-menu a:hover{
    color: var(--stormy-gold-bright);
}

/* =========================================
   CONTENT WRAPPER / PANEL
   ========================================= */

.site-content,
.entry-content,
main{
    max-width:1100px;
    margin:40px auto;
    padding:40px;
    background: var(--stormy-panel);
    border-radius:14px;
    box-shadow:0 20px 50px rgba(0,0,0,0.4);
}

/* =========================================
   HEADINGS
   ========================================= */

h1,h2,h3{
    color:#fff;
    font-family:'Oswald', sans-serif;
    letter-spacing:1px;
}

/* =========================================
   LINKS — STORMY GOLD
   ========================================= */

a{
    color: var(--stormy-gold);
    text-decoration:none;
    font-weight:500;
}

a:hover{
    color: var(--stormy-gold-bright);
    text-decoration:underline;
}

/* =========================================
   FOOTER
   ========================================= */

footer{
    text-align:center;
    padding:30px;
    font-size:.9rem;
    opacity:.7;
}
/* ===== Stormy Dropdown Menu ===== */

.stormy-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    gap: 30px;
}

.stormy-menu > li {
    position: relative;
}

.stormy-menu a {
    text-decoration: none;
    font-weight: bold;
    letter-spacing: 1px;
}

/* Hide submenu by default */
.stormy-menu .sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #0d1b2a;
    padding: 12px 0;
    list-style: none;
    min-width: 220px;
    border: 1px solid #d4af37;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}

/* Show on hover */
.stormy-menu li:hover > .sub-menu {
    display: block;
}

/* Submenu items */
.stormy-menu .sub-menu li {
    padding: 8px 20px;
}

.stormy-menu .sub-menu li a {
    display: block;
    color: #d4af37;
}
/* ===== Force submenu items vertical ===== */

.stormy-menu li {
    position: relative;
}

.stormy-menu .sub-menu {
    display: none;
}

.stormy-menu li:hover > .sub-menu {
    display: block;
}

.stormy-menu .sub-menu li {
    display: block !important;
    width: 100%;
}

.stormy-menu .sub-menu {
    flex-direction: column !important;
}
/* ===== Dropdown polish: centered, tighter, touch-friendly ===== */

/* Ensure parent LI is the positioning anchor */
.stormy-nav .stormy-menu > li {
  position: relative;
}

/* Dropdown panel */
.stormy-nav .stormy-menu .sub-menu {
  display: none !important;
  position: absolute !important;
  top: calc(100% + 10px) !important;
  left: 50% !important;
  transform: translateX(-50%) !important;

  background: #0d1b2a;
  border: 1px solid #d4af37;
  border-radius: 12px;
  padding: 10px;
  min-width: 220px;
  box-shadow: 0 12px 28px rgba(0,0,0,0.55);
  z-index: 9999;
}

/* Show on hover (desktop) */
.stormy-nav .stormy-menu > li:hover > .sub-menu {
  display: block !important;
}

/* Show on keyboard focus / tap-focus (touch-friendly) */
.stormy-nav .stormy-menu > li:focus-within > .sub-menu {
  display: block !important;
}

/* Submenu items stack properly */
.stormy-nav .stormy-menu .sub-menu li {
  display: block !important;
  width: 100%;
  margin: 0;
  padding: 0;
}

/* Submenu link button styling */
.stormy-nav .stormy-menu .sub-menu li a {
  display: block;
  padding: 12px 14px;
  border-radius: 10px;
  text-align: center;
  white-space: nowrap;
}

/* Optional: subtle hover on submenu item */
.stormy-nav .stormy-menu .sub-menu li a:hover {
  background: rgba(212,175,55,0.12);
}
/* ===== Dropdown click-fix: hover bridge + no gap ===== */

/* Give the parent item a little "hover runway" */
.stormy-nav .stormy-menu > li {
  position: relative;
  padding-bottom: 14px; /* bridge space so hover doesn't drop */
}

/* Pull dropdown up so there's no dead gap */
.stormy-nav .stormy-menu .sub-menu {
  top: 100% !important;         /* no extra gap */
  margin-top: 0 !important;
}

/* Keep dropdown open while hovering the submenu itself */
.stormy-nav .stormy-menu > li:hover > .sub-menu,
.stormy-nav .stormy-menu > li:focus-within > .sub-menu,
.stormy-nav .stormy-menu .sub-menu:hover {
  display: block !important;
}