/* Variables globales de marca Golden Gym */
:root {
  --primary: #c9a227;
  --primary-contrast: #111111;
  --primary-rgb: 201, 162, 39;
  --bg: #111111;
  --surface: #1a1a1a;
  --text: #ffffff;
  --text-muted: #cfcfcf;
  --border: #3a3a3a;
  --focus-ring: rgba(var(--primary-rgb), 0.35);

  --color-dorado-main: var(--primary);
  --color-dorado: var(--primary);
  --color-dorado-hover: color-mix(in srgb, var(--primary) 82%, black);
  --color-dorado-rgb: var(--primary-rgb);
  --color-dorado-ink: var(--primary-contrast);
  --color-fondo-oscuro: var(--bg);
  --color-texto-claro: var(--text);
  --radius-none: 0;
}

/*
  Unificación de paddings horizontales para módulos.
  Se aplica a contenedores principales dentro de #content para mantener
  consistencia con las reglas de gutter de Bootstrap (sin hardcodear px).
*/
#content > .container,
#content > .container-fluid,
#content > .container-sm,
#content > .container-md,
#content > .container-lg,
#content > .container-xl,
#content > .container-xxl {
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
}

.gg-no-radius,
.gg-no-radius * {
  border-radius: var(--radius-none) !important;
}

/* Utilidades comunes para mantener una UI sin bordes redondeados */
.gg-radius-none {
  border-radius: var(--radius-none) !important;
}

.gg-radius-none-top {
  border-top-left-radius: var(--radius-none) !important;
  border-top-right-radius: var(--radius-none) !important;
}

.gg-radius-none-bottom {
  border-bottom-left-radius: var(--radius-none) !important;
  border-bottom-right-radius: var(--radius-none) !important;
}

/* Override de Bootstrap para evitar radios por defecto */
.btn,
.card,
.badge,
.form-control,
.form-select,
.input-group-text,
.dropdown-menu,
.modal-content,
.modal-header,
.modal-footer,
.alert,
.list-group-item,
.nav-pills .nav-link,
.pagination .page-link,
.toast,
.accordion-button,
.accordion-item,
.offcanvas,
.offcanvas-header,
.offcanvas-body {
  border-radius: var(--radius-none) !important;
}

/* Baseline oscuro para formularios (reutilizable y scoped al contenido principal) */
:root {
  --gg-text: #e9ecef;
  --gg-text-muted: rgba(233, 236, 239, 0.75);
  --gg-border: rgba(255, 255, 255, 0.16);
  --gg-input-bg: rgba(0, 0, 0, 0.25);
  --gg-card-bg: rgba(0, 0, 0, 0.35);
}

.gg-dark-form,
.content .gg-dark-form,
.wrapper .gg-dark-form,
.app .gg-dark-form,
body.dark #content,
body.theme-dark #content,
body.app-dark #content {
  color: var(--gg-text);
}

.gg-dark-form .gg-text,
.gg-dark-form label,
.gg-dark-form .form-label,
.gg-dark-form legend,
.gg-dark-form .col-form-label,
.gg-dark-form h1,
.gg-dark-form h2,
.gg-dark-form h3,
.gg-dark-form h4,
.gg-dark-form h5,
.gg-dark-form h6 {
  color: var(--gg-text) !important;
}

.gg-dark-form .gg-text-muted,
.gg-dark-form small,
.gg-dark-form .form-text,
.gg-dark-form .text-muted {
  color: var(--gg-text-muted) !important;
}

.gg-dark-form .card,
.gg-dark-form .card-header,
.gg-dark-form .card-body,
.gg-dark-form .gg-dark-card {
  background: var(--gg-card-bg);
  border-color: var(--gg-border);
  opacity: 1 !important;
}

.gg-dark-form .form-control,
.gg-dark-form .form-select,
.gg-dark-form textarea {
  background: var(--gg-input-bg);
  color: var(--gg-text);
  border-color: var(--gg-border);
}

.gg-dark-form .form-control:focus,
.gg-dark-form .form-select:focus,
.gg-dark-form textarea:focus {
  background: var(--gg-input-bg);
  color: var(--gg-text);
  border-color: rgba(var(--primary-rgb), 0.55);
  box-shadow: 0 0 0 1px var(--focus-ring);
}

.gg-dark-form .form-control::placeholder,
.gg-dark-form textarea::placeholder {
  color: rgba(233, 236, 239, 0.55);
  opacity: 1;
}

.gg-dark-form .form-check-input {
  background-color: rgba(0, 0, 0, 0.45);
  border-color: var(--gg-border);
}

.gg-dark-form .form-check-input:checked {
  background-color: var(--primary);
  border-color: var(--primary);
}

.gg-dark-form .gg-divider {
  border: 0;
  border-top: 1px solid var(--gg-border);
  opacity: 1;
}

.gg-dark-form .section-title {
  font-size: 1.05rem;
  font-weight: 700;
}

.gg-dark-form .gg-btn-gold {
  background: var(--primary);
  border-color: var(--primary);
  color: var(--primary-contrast);
  font-weight: 700;
}

.gg-dark-form .gg-btn-gold:hover,
.gg-dark-form .gg-btn-gold:focus {
  background: color-mix(in srgb, var(--primary) 82%, black);
  border-color: color-mix(in srgb, var(--primary) 82%, black);
  color: var(--primary-contrast);
}
