@charset "UTF-8";
/*
 * Canary Port Layer for Royal-Exodus (Znote layout)
 * Aplica estética clásica tipo Canary sin romper la arquitectura actual.
 */

:root {
  --canary-panel: #ead8be;
  --canary-panel-soft: #f5e7d1;
  --canary-panel-odd: #f3e2c8;
  --canary-panel-even: #dfc7a8;
  --canary-border: #5f4d41;
  --canary-border-strong: #3b2b20;
  --canary-head: #5f4d41;
  --canary-head-2: #4a3b31;
  --canary-text: #5a2800;
  --canary-link: #003f8f;
  --canary-link-hover: #0068da;
  --canary-shadow: rgba(40, 20, 8, 0.35);
}

/* Tipografía central tipo Tibia clásico */
body,
.global-desc__content,
.desc-changelog__block,
table,
input,
select,
textarea,
button {
  font-family: Verdana, Arial, "Times New Roman", sans-serif !important;
}

/* Contenedor principal de contenido */
.global-desc__content,
.hts__block,
.desc-changelog__block,
.cp-login,
.char-profile__panel,
.myaccount-panel__card {
  background: linear-gradient(180deg, var(--canary-panel-soft), var(--canary-panel)) !important;
  border: 2px solid var(--canary-border) !important;
  box-shadow: 0 6px 16px var(--canary-shadow), inset 0 0 0 1px #fff2db !important;
  color: var(--canary-text) !important;
}

.global-desc__content a,
.hts__block a,
.desc-changelog__block a,
.cp-login a,
.myaccount-panel a {
  color: var(--canary-link) !important;
}

.global-desc__content a:hover,
.hts__block a:hover,
.desc-changelog__block a:hover,
.cp-login a:hover,
.myaccount-panel a:hover {
  color: var(--canary-link-hover) !important;
  text-decoration: underline !important;
}

/* Titulares */
.donate-page__title,
.page-title__text,
.desc-text__title,
.hts__block-title-big,
.main-content__title,
.global-desc__content-title-text {
  color: #4d2400 !important;
  text-shadow: 0 1px 0 #fff2db;
}

.page-title__text span,
.desc-text__text,
.hts__block-desc,
.hts__block-files-text,
.global-desc__content span,
.desc-main,
.desc-main * {
  color: var(--canary-text) !important;
}

/* Encabezados de panel tipo caption Canary */
.hts__block-title,
.desc-main__header,
.global-desc__content-title,
.main-content__title {
  background: linear-gradient(180deg, var(--canary-head), var(--canary-head-2)) !important;
  border: 1px solid #342219 !important;
  box-shadow: inset 0 0 0 1px rgba(255, 235, 210, 0.15);
}

.hts__block-title *,
.desc-main__header *,
.global-desc__content-title *,
.main-content__title * {
  color: #fff !important;
}

/* Botones estilo clásico con lectura alta */
.btn.gray,
.btn.yellow,
.main-content__title-button,
a.btn {
  border-radius: 0 !important;
  border: 1px solid #2f1f16 !important;
  box-shadow: inset 0 0 0 1px rgba(255, 236, 205, 0.2), 0 2px 0 #2f1f16 !important;
}

.btn.gray {
  background: linear-gradient(180deg, #8a6f5b, #5c4639) !important;
}

.btn.yellow {
  background: linear-gradient(180deg, #d7ab51, #9d6e1b) !important;
}

.btn span,
.btn i {
  color: #ffe2b0 !important;
  text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000;
}

/* Tablas globales tipo Canary */
table {
  border-collapse: collapse;
}

table tr:nth-child(odd) td {
  background: var(--canary-panel-odd);
}

table tr:nth-child(even) td {
  background: var(--canary-panel-even);
}

table th,
.TableContainer .CaptionContainer,
.TableContainer .CaptionContainer .CaptionInnerContainer,
.LabelH td {
  background: var(--canary-head) !important;
  color: #fff !important;
  border: 1px solid #3b3029 !important;
}

table td {
  color: var(--canary-text) !important;
  border: 1px solid rgba(95, 77, 65, 0.22);
}

/* Inputs/forms con estética tibia clásica */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="datetime-local"],
select,
textarea {
  background: #f4e7d5 !important;
  color: #4b2500 !important;
  border: 1px solid #7f6046 !important;
  box-shadow: inset 0 1px 2px rgba(90, 40, 0, 0.16);
}

input::placeholder,
textarea::placeholder {
  color: #7e614a !important;
}

/* Navegación superior con toque Canary */
.navigation,
.navigation__bar,
.navigation__drop-box,
.m-nav {
  background-color: rgba(26, 18, 12, 0.85) !important;
  backdrop-filter: blur(3px);
}

.navigation__link,
.m-nav__link {
  border: 1px solid transparent;
}

.navigation__link:hover,
.navigation__link.active,
.m-nav__link:hover {
  border-color: rgba(255, 194, 112, 0.45);
  background: linear-gradient(180deg, rgba(120, 78, 38, 0.35), rgba(70, 44, 24, 0.4));
}

.navigation__link span,
.m-nav__link span,
.open-drop-box {
  color: #f4ddc0 !important;
}

/* Bloques de descargas y cards */
.hts__block-files,
.opening-countdown,
.hts__block-info-static,
.home-widgets__block,
.re-world-dock__panel,
.re-discord-panel__btn {
  border: 1px solid #6c5038 !important;
  background: linear-gradient(180deg, #f1dfc4, #dcc2a2) !important;
  box-shadow: 0 3px 8px rgba(35, 16, 8, 0.18), inset 0 0 0 1px rgba(255, 242, 222, 0.65) !important;
}

.opening-countdown__title,
.opening-countdown__value,
.opening-countdown__unit,
.hts__block-info-static,
.hts__block-info-static * {
  color: #5a2800 !important;
  text-shadow: none !important;
}

/* Noticias/foro/listados */
.news,
.news-block,
.news-ticker,
.forum-post,
.forum-thread,
.guild-box,
.server-info {
  background: linear-gradient(180deg, #f7e9d5, #dfc6a5) !important;
  border: 1px solid #6f533b !important;
  color: #5a2800 !important;
}

/* Footer estilo marco clásico */
.footer {
  border-top: 2px solid #7b5c42;
  background: linear-gradient(180deg, rgba(28, 18, 14, 0.92), rgba(18, 11, 8, 0.96)) !important;
}

.footer__cpr-title,
.footer__credits li,
.footer__links a,
.footer * {
  color: #e8d2b8 !important;
}

/* Modo ligero se mantiene dominante */
html.re-lightweight .global-desc__content,
html.re-lightweight .hts__block,
html.re-lightweight .desc-changelog__block,
html.re-lightweight .cp-login,
html.re-lightweight .char-profile__panel,
html.re-lightweight .myaccount-panel__card {
  box-shadow: 0 3px 10px rgba(20, 8, 2, 0.24), inset 0 0 0 1px #fff0da !important;
}

/* Responsive */
@media (max-width: 960px) {
  .global-desc__content,
  .hts__block,
  .desc-changelog__block {
    border-width: 1px !important;
  }

  .btn span {
    font-size: 12px !important;
  }
}