/*
Theme Name: Xoo Minimal Shell
Theme URI: https://xoo.gr/
Author: Nikos Tzikos
Author URI: https://xoo.gr/
Description: Minimal dark shell theme for Xoo.GR with GUI and MAP fullscreen-friendly rendering, WooCommerce support, browser theme-color handling, and reduced frontend WordPress traces. Credits: developed by Nikos Tzikos.
Version: 1.0.4
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: xoo-minimal-shell
*/

:root {
  --xoo-primary: #ccff00;
  --xoo-secondary: #00fefc;
  --xoo-header: #17586b;
  --xoo-window: #0a4b5f;
  --xoo-app: #083a4a;
  --xoo-text: #e8f6fb;
  --xoo-muted: #9fc2cf;
  --xoo-border: rgba(0, 254, 252, 0.18);
  --xoo-radius: 5px;
  --xoo-shell-width: 1180px;
  --xoo-gap: clamp(14px, 2vw, 24px);
}

html {
  min-height: 100%;
  background: var(--xoo-app);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-height: 100vh;
  margin: 0;
  background: var(--xoo-app);
  color: var(--xoo-text);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
  overflow-x: hidden;
}

body.xoo-normal-context {
  background:
    radial-gradient(circle at top center, rgba(0, 254, 252, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(23, 88, 107, 0.92) 0%, rgba(8, 58, 74, 1) 240px);
}

body.xoo-shell-context,
body.xoo-shell-gui,
body.xoo-shell-map {
  background: var(--xoo-app);
}

a {
  color: var(--xoo-secondary);
  text-decoration: none;
}

a:hover,
a:focus {
  color: var(--xoo-primary);
}

img,
svg,
video,
iframe,
embed,
object {
  max-width: 100%;
  height: auto;
  border: 0;
}

iframe {
  display: block;
}

button,
input,
select,
textarea {
  font: inherit;
  border-radius: var(--xoo-radius);
}

input,
select,
textarea {
  width: 100%;
  max-width: 100%;
  background: rgba(10, 75, 95, 0.92);
  color: var(--xoo-text);
  border: 1px solid var(--xoo-border);
  padding: 12px 14px;
  box-sizing: border-box;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
  outline: 2px solid rgba(204, 255, 0, 0.4);
  outline-offset: 1px;
}

button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.button,
.wc-forward,
.wp-element-button,
.checkout-button,
.single_add_to_cart_button,
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background: var(--xoo-header);
  color: var(--xoo-text);
  border: 1px solid rgba(0, 254, 252, 0.26);
  padding: 11px 16px;
  border-radius: var(--xoo-radius);
  cursor: pointer;
  box-shadow: none;
}

button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
.button:hover,
.wc-forward:hover,
.wp-element-button:hover,
.checkout-button:hover,
.single_add_to_cart_button:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
  background: var(--xoo-window);
  color: var(--xoo-primary);
}

.site-shell {
  min-height: 100vh;
}

.site-main {
  display: block;
}

.xoo-content-shell {
  width: min(100% - 28px, var(--xoo-shell-width));
  margin: 0 auto;
  padding: 18px 0 28px;
}

.xoo-content-card {
  background: rgba(10, 75, 95, 0.78);
  border: 1px solid var(--xoo-border);
  border-radius: var(--xoo-radius);
  padding: clamp(16px, 2vw, 24px);
  box-sizing: border-box;
  backdrop-filter: blur(4px);
}

body.xoo-shell-context .xoo-content-shell,
body.xoo-shell-gui .xoo-content-shell,
body.xoo-shell-map .xoo-content-shell {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

body.xoo-shell-context .xoo-content-card,
body.xoo-shell-gui .xoo-content-card,
body.xoo-shell-map .xoo-content-card {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  backdrop-filter: none;
}

body.xoo-shell-context .entry-content,
body.xoo-shell-gui .entry-content,
body.xoo-shell-map .entry-content,
body.xoo-shell-context .woocommerce,
body.xoo-shell-gui .woocommerce,
body.xoo-shell-map .woocommerce {
  margin: 0;
}

.entry-title,
.page-title,
.archive-title,
.search-title {
  margin: 0 0 14px;
  color: var(--xoo-primary);
  line-height: 1.15;
}

.entry-content > :first-child,
.page-content > :first-child {
  margin-top: 0;
}

.entry-content > :last-child,
.page-content > :last-child {
  margin-bottom: 0;
}

.site-footer {
  height: 0;
  overflow: hidden;
  border: 0;
  margin: 0;
  padding: 0;
}

.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.woocommerce,
.woocommerce-page {
  color: var(--xoo-text);
}

.woocommerce form .form-row {
  margin-bottom: 14px;
}

.woocommerce table.shop_table,
.woocommerce table.shop_attributes,
.woocommerce table.cart td,
.woocommerce table.cart th,
.woocommerce-checkout-review-order-table,
.woocommerce table.my_account_orders {
  border-color: var(--xoo-border);
}

.woocommerce table.shop_table,
.woocommerce-checkout #payment,
.woocommerce .cart-collaterals .cart_totals,
.woocommerce .woocommerce-customer-details address,
.woocommerce form.checkout,
.woocommerce form.login,
.woocommerce form.register,
.woocommerce-account .addresses .title,
.select2-container--default .select2-selection--single,
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
  background: rgba(10, 75, 95, 0.78);
  border-radius: var(--xoo-radius);
}

.select2-container--default .select2-selection--single,
.select2-dropdown {
  border-color: var(--xoo-border);
  background: rgba(10, 75, 95, 0.98);
  color: var(--xoo-text);
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-results__option {
  color: var(--xoo-text);
}

.woocommerce a.remove {
  color: var(--xoo-secondary) !important;
}

.woocommerce a.remove:hover {
  color: var(--xoo-primary) !important;
  background: transparent;
}

.woocommerce-info,
.woocommerce-message,
.woocommerce-error,
.woocommerce-notices-wrapper > * {
  border-radius: var(--xoo-radius);
}

table {
  width: 100%;
  border-collapse: collapse;
}

td,
th {
  padding: 10px 12px;
}

pre,
code {
  max-width: 100%;
  overflow-x: auto;
}

@media (max-width: 782px) {
  .xoo-content-shell {
    width: min(100% - 18px, var(--xoo-shell-width));
    padding: 12px 0 18px;
  }

  body.xoo-shell-context .xoo-content-shell,
  body.xoo-shell-gui .xoo-content-shell,
  body.xoo-shell-map .xoo-content-shell {
    width: 100%;
    padding: 0;
  }

  .xoo-content-card {
    padding: 14px;
  }

  .woocommerce form .form-row-first,
  .woocommerce form .form-row-last {
    width: 100%;
    float: none;
  }
}
