/*
 * V3 Creative Studio — Global Stylesheet (Master Entry)
 *
 * Load order:
 *   1. Design tokens (custom properties)
 *   2. Typography system
 *   3. Grid + containers
 *   4. Buttons
 *   5. Forms
 *   6. Cards
 *   7. Animations & motion
 *   8. Header
 *   9. Footer
 *  10. Base reset & HTML defaults (this file)
 *  11. WordPress compatibility
 *
 * Enqueued via wp_enqueue_style( 'v3cs-global' ) in inc/enqueue.php.
 * Fonts are enqueued separately via 'v3cs-fonts' handle.
 *
 * @package V3CS_Theme
 * @version 2.0.0
 */

/* ==========================================================================
   DESIGN SYSTEM IMPORTS
   ========================================================================== */

@import url('./_tokens.css');
@import url('./_typography.css');
@import url('./_grid.css');
@import url('./_buttons.css');
@import url('./_forms.css');
@import url('./_cards.css');
@import url('./_animations.css');
@import url('./_header.css');
@import url('./_footer.css');
@import url('./_gallery.css');
@import url('./_luxury.css');   /* Phase 9 — Luxury refinement layer (imported last) */

/* ==========================================================================
   BOX MODEL RESET
   ========================================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
  margin:     0;
  padding:    0;
}

/* ==========================================================================
   HTML & ROOT
   ========================================================================== */

html {
  font-size:               100%;      /* 16px base */
  scroll-behavior:         smooth;
  -webkit-text-size-adjust: 100%;
  text-size-adjust:         100%;
  height:                  100%;
}

/* Offset smooth scroll for fixed header */
html:has(.v3cs-site-header) {
  scroll-padding-top: var(--v3cs-header-height);
}

/* ==========================================================================
   BODY
   ========================================================================== */

body {
  min-height:          100svh;
  overflow-x:          hidden;
  background-color:    var(--v3cs-color-bg);
  color:               var(--v3cs-color-text);
  font-family:         var(--v3cs-font-body);
  font-size:           var(--v3cs-fs-base);
  line-height:         var(--v3cs-lh-relaxed);
  -webkit-font-smoothing:  antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Admin bar offset */
.admin-bar .v3cs-site-header {
  top: var(--wp-admin--admin-bar--height, 32px);
}

/* ==========================================================================
   IMAGES & MEDIA
   ========================================================================== */

img,
picture,
video,
canvas,
svg {
  display:    block;
  max-width:  100%;
  height:     auto;
}

img {
  font-style:  italic;  /* alt text styling */
  color:       var(--v3cs-color-text-muted);
}

/* Prevent video from overflowing */
video {
  object-fit: cover;
}

/* ==========================================================================
   LINKS (base — enhanced in _typography.css)
   ========================================================================== */

a {
  color:           var(--v3cs-color-gold);
  text-decoration: none;
}

a:not([class]):hover {
  text-decoration: underline;
}

/* ==========================================================================
   TABLES
   ========================================================================== */

table {
  width:           100%;
  border-collapse: collapse;
  border-spacing:  0;
  font-size:       var(--v3cs-fs-sm);
}

th {
  font-family:    var(--v3cs-font-body);
  font-size:      var(--v3cs-fs-xs);
  font-weight:    var(--v3cs-fw-semibold);
  letter-spacing: var(--v3cs-ls-label);
  text-transform: uppercase;
  text-align:     left;
  color:          var(--v3cs-color-text-muted);
  padding:        var(--v3cs-space-3) var(--v3cs-space-4);
  border-bottom:  2px solid var(--v3cs-color-border);
}

td {
  padding:       var(--v3cs-space-4);
  border-bottom: var(--v3cs-border-thin);
  color:         var(--v3cs-color-text);
}

tr:last-child td {
  border-bottom: none;
}

tr:hover td {
  background: var(--v3cs-color-gray-50);
}

/* ==========================================================================
   HR / RULE
   ========================================================================== */

hr {
  border:     none;
  height:     1px;
  background: var(--v3cs-color-border);
  margin:     var(--v3cs-space-7) 0;
}

hr.v3cs-hr--gold {
  background: var(--v3cs-gradient-gold);
  height:     1px;
  opacity:    0.6;
  width:      80px;
  margin-inline: auto;
}

/* ==========================================================================
   FOCUS STYLES (global fallback)
   ========================================================================== */

:focus { outline: none; }

:focus-visible {
  outline:        2px solid var(--v3cs-color-gold);
  outline-offset: 3px;
  border-radius:  2px;
}

/* ==========================================================================
   SCROLL BAR (Webkit)
   ========================================================================== */

::-webkit-scrollbar {
  width:  6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: var(--v3cs-color-gray-100);
}

::-webkit-scrollbar-thumb {
  background:    var(--v3cs-color-gray-300);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--v3cs-color-gold-dark);
}

/* ==========================================================================
   PAGE LAYOUT SHELL
   ========================================================================== */

.v3cs-site {
  display:        flex;
  flex-direction: column;
  min-height:     100svh;
}

.v3cs-site-main {
  flex: 1;
}

/* ==========================================================================
   WORDPRESS CORE COMPATIBILITY
   ========================================================================== */

/* Gutenberg block alignment */
.wp-block-image img {
  border-radius: var(--v3cs-radius-sm);
}

/* Core paragraph */
.wp-block-paragraph {
  font-size:   var(--v3cs-fs-base);
  line-height: var(--v3cs-lh-relaxed);
}

/* Core quote */
.wp-block-quote {
  font-family:  var(--v3cs-font-heading);
  font-size:    var(--v3cs-fs-xl);
  font-style:   italic;
  font-weight:  var(--v3cs-fw-light);
  border-left:  3px solid var(--v3cs-color-gold);
  padding-left: var(--v3cs-space-6);
  margin:       var(--v3cs-space-7) 0;
}

.wp-block-quote cite,
.wp-block-quote footer {
  font-family: var(--v3cs-font-body);
  font-size:   var(--v3cs-fs-xs);
  font-style:  normal;
  font-weight: var(--v3cs-fw-semibold);
  letter-spacing: var(--v3cs-ls-label);
  text-transform: uppercase;
  color:       var(--v3cs-color-text-muted);
  margin-top:  var(--v3cs-space-3);
  display:     block;
}

/* Core separator */
.wp-block-separator {
  border:     none;
  height:     1px;
  background: var(--v3cs-color-border);
}

.wp-block-separator.is-style-wide {
  background: var(--v3cs-gradient-gold);
  opacity:    0.5;
}

/* Core cover */
.wp-block-cover {
  border-radius: var(--v3cs-radius-md);
  overflow:      hidden;
}

/* Captions */
figcaption,
.wp-element-caption {
  font-size:      var(--v3cs-fs-xs);
  color:          var(--v3cs-color-text-muted);
  text-align:     center;
  margin-top:     var(--v3cs-space-2);
  font-style:     italic;
}

/* ==========================================================================
   PRINT STYLES
   ========================================================================== */

@media print {
  .v3cs-site-header,
  .v3cs-site-footer,
  .v3cs-btn,
  .v3cs-header__toggle,
  nav {
    display: none !important;
  }

  body {
    font-size:  12pt;
    line-height: 1.5;
    color:      #000;
    background: #fff;
  }

  h1, h2, h3 {
    page-break-after: avoid;
  }

  a[href]::after {
    content: ' (' attr(href) ')';
    font-size: 0.8em;
    color: #555;
  }
}

/* ==========================================================================
   CONSTRAINED LAYOUT — Safe global content padding
   Works WITH WordPress's block layout system instead of fighting it.
   ========================================================================== */

/* Prevent any horizontal overflow on mobile */
.v3cs-site-main {
  overflow-x: hidden;
}

/* Groups directly inside main that don't use WordPress's constrained
   layout get a minimum side gutter so text never touches the edge */
.v3cs-site-main > .wp-block-group:not(.alignfull):not([class*="wp-container"]) {
  padding-left:   max(20px, env(safe-area-inset-left, 0px));
  padding-right:  max(20px, env(safe-area-inset-right, 0px));
}

/* Columns that overflow on mobile — force wrap */
@media (max-width: 767px) {
  .v3cs-site-main .wp-block-columns {
    flex-direction: column !important;
    gap: 40px !important;
  }

  .v3cs-site-main .wp-block-columns > .wp-block-column {
    width: 100% !important;
    flex-basis: 100% !important;
  }
}

/* ==========================================================================
   FOOTER — force nav links visible, never hamburger
   ========================================================================== */

/* WordPress's responsive navigation: force always-open in footer */
.v3cs-site-footer .wp-block-navigation__responsive-container-open,
.v3cs-site-footer .wp-block-navigation .wp-block-navigation__responsive-container-close,
.v3cs-site-footer button.wp-block-navigation__responsive-container-open {
  display: none !important;
}

.v3cs-site-footer .wp-block-navigation__responsive-container {
  display:    block !important;
  position:   static !important;
  width:      auto !important;
  height:     auto !important;
  background: transparent !important;
  overflow:   visible !important;
}

.v3cs-site-footer .wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content {
  display:        flex !important;
  flex-direction: column !important;
  gap:            10px !important;
}

.v3cs-site-footer .wp-block-navigation__container {
  display:        flex !important;
  flex-direction: column !important;
  gap:            10px !important;
  list-style:     none !important;
  padding:        0 !important;
  margin:         0 !important;
}

.v3cs-site-footer .wp-block-navigation__container .wp-block-navigation-item {
  display: block !important;
}
