/* =========================================================
   Tibian — custom pages styles (dark-gold theme, Telara)
   Podpinany warunkowo: shop, exchange (+ inne nasze strony)
   ========================================================= */

/* --- bloki .box/.hd/.bd używane przez nasze strony --- */
.box .hd {
	background: linear-gradient(180deg, #c9a227 0%, #8a6d1f 100%);
	color: #fff;
	font-family: 'Bebas Neue', Bebas, sans-serif;
	font-size: 20px;
	letter-spacing: .5px;
	padding: 8px 16px;
	border-radius: 4px 4px 0 0;
}
.box .hd .ic { display: inline-block; width: 16px; }
.box .bd {
	background: #efe9da;
	border: 1px solid #d8cba6;
	border-top: 0;
	border-radius: 0 0 4px 4px;
	padding: 18px 20px;
	color: #3a3428;
}

/* --- intro --- */
.gs-intro h3 {
	color: #8a6d1f;
	font-family: 'Bebas Neue', Bebas, sans-serif;
	font-size: 24px;
	margin: 0 0 10px;
}
.gs-intro p { color: #3a3428; }

/* --- pasek balansu / logowanie --- */
.shop-balance, .shop-login {
	background: #efe9da;
	border: 1px solid #d8cba6;
	color: #3a3428;
	padding: 12px 16px;
	border-radius: 6px;
	margin: 14px 0;
}
.shop-balance strong, .shop-login a { color: #8a6d1f; }
.shop-login .btn { margin-top: 6px; }

/* --- siatka pakietów --- */
.shop-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	margin: 18px 0;
}
@media (max-width: 900px) { .shop-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .shop-grid { grid-template-columns: 1fr; } }

.shop-card {
	background: linear-gradient(180deg, #f7f3e8 0%, #efe9da 100%);
	border: 1px solid #d8cba6;
	border-radius: 6px;
	padding: 18px 14px 16px;
	text-align: center;
	box-shadow: 0 2px 0 rgba(0,0,0,.08);
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.shop-card:hover { transform: translateY(-3px); box-shadow: 0 8px 18px rgba(0,0,0,.25); border-color: #c9a227; }
.shop-card-hot { border-color: #c9a227; box-shadow: 0 0 0 2px rgba(201,162,39,.35); position: relative; }
.shop-card-hot::after {
	content: "BEST";
	position: absolute; top: -10px; right: 10px;
	background: linear-gradient(180deg, #c9a227, #8a6d1f);
	color: #fff; font-size: 11px; font-weight: bold;
	padding: 2px 8px; border-radius: 3px; letter-spacing: 1px;
}
.shop-price { color: #8a6d1f; font-family: 'Bebas Neue', Bebas, sans-serif; font-size: 30px; line-height: 1.1; }
.shop-coins { color: #2b2418; font-family: 'Bebas Neue', Bebas, sans-serif; font-size: 34px; line-height: 1.1; margin: 2px 0; }
.shop-coins span { font-size: 18px; color: #8a6d1f; margin-left: 4px; }
.shop-bonus {
	display: inline-block; margin: 6px 0 10px;
	background: #e9dfc2; border: 1px solid #d8cba6; color: #6e5412;
	font-size: 13px; padding: 2px 10px; border-radius: 10px;
}
.shop-bonus-none { background: #efe9da; color: #9a8f76; }

/* --- przyciski --- */
.btn-gold,
.btn.btn-gold {
	background: linear-gradient(180deg, #c9a227 0%, #96781f 100%);
	border: 1px solid #7a5c0e;
	color: #fff;
	text-shadow: 0 1px 0 rgba(0,0,0,.35);
	font-weight: bold;
	padding: 8px 18px;
	border-radius: 4px;
	display: inline-block;
	width: 100%;
}
.btn-gold:hover, .btn.btn-gold:hover { background: linear-gradient(180deg, #e3c256 0%, #b8860b 100%); color: #fff; }
.shop-buy { margin-top: 6px; }
.shop-buy-locked { opacity: .5; cursor: not-allowed; }

/* --- kroki / notki / zgoda --- */
.shop-steps { margin: 8px 0; padding-left: 20px; color: #3a3428; }
.shop-steps li { margin-bottom: 6px; }
.shop-note { color: #6b6350; font-size: 13px; margin: 8px 0; }
.shop-note strong { color: #8a6d1f; }
.shop-note a { color: #b8860b; font-weight: bold; }

.shop-consent-wrap {
	background: #f7f3e8; border: 1px solid #d8cba6; border-radius: 4px;
	padding: 10px 14px; margin: 12px 0; color: #3a3428;
}
.shop-consent { margin: 0; }

.shop-thanks {
	background: #2f3a1d; border: 1px solid #6cd94b; color: #e8f0d0;
	padding: 12px 16px; border-radius: 4px; margin: 14px 0;
}


/* --- karty sklepu: czytelniejsza wersja (override) --- */
.shop-card {
	background: linear-gradient(180deg, #fffdf6 0%, #f2ebd8 100%);
	border: 1px solid #cbb87e;
	border-top: 3px solid #c9a227;
	box-shadow: 0 3px 10px rgba(60,44,10,.14);
}
.shop-card:hover { border-top-color: #e3c256; }
.shop-price { color: #6e5412; }
.shop-coins { color: #241d10; }


/* --- downloads: karty + zlote przyciski --- */
.dl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 18px 0; }
@media (max-width: 900px) { .dl-grid { grid-template-columns: 1fr; } }
.dl-card { display: flex; flex-direction: column; background: linear-gradient(180deg, #fffdf6 0%, #f2ebd8 100%); border: 1px solid #cbb87e; border-top: 3px solid #c9a227; border-radius: 6px; padding: 16px 14px; text-align: center; box-shadow: 0 3px 10px rgba(60,44,10,.14); }
.dl-card h2 { margin: 2px 0 4px; font-size: 22px; color: #4a3a0e; }
.dl-sub { color: #6b6350; font-size: 12px; margin: 0 0 12px; }
.dl-btn { display: inline-block; align-self: center; margin-top: auto; background: linear-gradient(180deg, #c9a227 0%, #96781f 100%); color: #fff !important; padding: 10px 20px; border-radius: 5px; font-weight: 700; text-decoration: none !important; border: 1px solid #7a5c0e; text-shadow: 0 1px 0 rgba(0,0,0,.35); box-shadow: 0 2px 6px rgba(60,44,10,.25); }
.dl-btn:hover { background: linear-gradient(180deg, #e3c256 0%, #b8860b 100%); }
.dl-btn small { opacity: .9; font-weight: 400; }
.dl-note { color: #6b6350; font-size: 13px; }


/* ---- Tibian: Census + Tools kalkulatory (2026-09-30) ---- */
.tib-cards { display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 18px; }
.tib-card { flex:1 1 150px; background:linear-gradient(180deg,#f4ecd4,#e8dcb8); border:1px solid #b99a3e; border-radius:6px; padding:12px 14px; text-align:center; box-shadow:0 2px 6px rgba(0,0,0,.25); }
.tib-card-num { font-size:22px; font-weight:bold; color:#7a5c0e; font-family:'Cinzel',serif; }
.tib-card-lbl { font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:#5b4a20; margin-top:4px; }
.tib-bar-row { display:flex; align-items:center; gap:10px; margin:7px 0; }
.tib-bar-lbl { width:150px; font-size:13px; color:#3a3428; text-align:right; }
.tib-bar-wrap { flex:1; background:#e6dcc0; border:1px solid #c9b063; border-radius:4px; height:18px; overflow:hidden; }
.tib-bar { height:100%; background:linear-gradient(90deg,#a9861f,#e0b93f); }
.tib-bar-val { width:130px; font-size:12px; color:#5b4a20; }
.tib-table { width:100%; border-collapse:collapse; margin-top:6px; }
.tib-table th { background:linear-gradient(180deg,#3a2f1a,#241c0d); color:#e8d9a8; padding:8px 10px; font-size:12px; text-transform:uppercase; letter-spacing:.05em; border:1px solid #55461f; }
.tib-table td { padding:7px 10px; border:1px solid #cbbd8f; font-size:13px; color:#2e2717; }
.tib-table tr:nth-child(even) td { background:#f1e9d0; }
.tib-table tr:nth-child(odd) td { background:#faf5e4; }
.tib-calc { max-width:760px; }
.tib-calc label { display:block; font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:#5b4a20; margin-bottom:4px; }
.tib-calc-row { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; }
.tib-calc-row input.form-control { width:auto; min-width:120px; }
.tib-calc-row .btn { margin-bottom:1px; }
.tib-calc-result { margin-top:14px; padding:12px 14px; background:#f7f0da; border:1px solid #c9b063; border-radius:5px; color:#2e2717; font-size:14px; }
.tib-calc-big { font-size:20px; font-weight:bold; color:#7a5c0e; margin-bottom:6px; font-family:'Cinzel',serif; }
@media (max-width: 768px) {
  .tib-card { flex:1 1 40%; }
  .tib-bar-lbl { width:90px; font-size:11px; }
  .tib-bar-val { width:auto; }
  .tib-calc-row { flex-direction:column; align-items:stretch; }
  .tib-calc-row input.form-control { width:100%; }
  .tib-calc-row .btn { width:100%; }
}

/* ===== KONTO: panel konta + podstrony (2026-09-30) ===== */
#account-manage { padding: 4px 2px; }
#account-manage #one { width: 178px; }
#account-manage #two { margin-left: 178px; padding-left: 14px; }
#account-manage .vertical-menu a {
  display: block; padding: 9px 12px; margin-bottom: 6px;
  background: linear-gradient(180deg, #57503f 0%, #3a3428 100%);
  color: #e3c256; font-size: 13px; font-weight: 600; letter-spacing: .02em;
  text-decoration: none; border: 1px solid #6e5412; border-radius: 5px;
  box-shadow: 0 1px 3px rgba(0,0,0,.3);
  transition: background .15s, color .15s, transform .15s;
}
#account-manage .vertical-menu a:hover {
  background: linear-gradient(180deg, #e3c256 0%, #b8860b 100%);
  color: #241c0e; border-color: #e3c256; transform: translateX(2px);
}
#account-manage h1 { color: #7a5c0e; font-size: 22px; border-bottom: 2px solid #c9a227; padding-bottom: 6px; margin: 2px 0 12px; }
#account-manage h2 { color: #8a6d1f; font-size: 17px; border-bottom: 1px solid #d8cba6; padding-bottom: 4px; margin: 16px 0 8px; }
#account-manage p { color: #3a3428; line-height: 1.5; }
#account-manage a { color: #8a6d1f; }
#account-manage a:hover { color: #b8860b; }
#account-manage table { width: 100%; border-collapse: collapse; margin: 6px 0 12px; }
#account-manage table td { padding: 7px 10px; border-bottom: 1px solid #e3d9bd; color: #2e2717; font-size: 13px; }
#account-manage table th { background: #8A6D1F; color: #fff; padding: 8px 10px; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; border-bottom: 2px solid #6e5412; }
#account-manage div[style*="text-align:center"], #account-manage div[style*="text-align: center"] {
  background: #f7f1e2; border: 1px dashed #c9a227; border-radius: 6px; padding: 12px 14px; margin: 10px 0;
}
/* przyciski i pola formularzy w tresci stron */
.main-content input[type=submit], .main-content button[type=submit] {
  background: linear-gradient(180deg, #e3c256 0%, #b8860b 100%);
  color: #241c0e; border: 1px solid #8a6d1f; border-radius: 5px;
  padding: 9px 20px; font-weight: 700; font-size: 13px; letter-spacing: .03em;
  cursor: pointer; text-transform: uppercase;
  box-shadow: 0 2px 4px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.35);
  transition: filter .15s, transform .1s;
}
.main-content input[type=submit]:hover, .main-content button[type=submit]:hover { filter: brightness(1.08); }
.main-content input[type=submit]:active, .main-content button[type=submit]:active { transform: translateY(1px); }
.main-content input[type=text], .main-content input[type=password], .main-content input[type=email],
.main-content select, .main-content textarea {
  background: #fffdf7; border: 1px solid #c6bda6; border-radius: 4px;
  padding: 7px 9px; color: #3a3428; font: inherit; font-size: 13px;
}
.main-content input[type=text]:focus, .main-content input[type=password]:focus, .main-content input[type=email]:focus,
.main-content select:focus, .main-content textarea:focus {
  outline: none; border-color: #c9a227; box-shadow: 0 0 0 2px rgba(201,162,39,.25);
}
.main-content td.LabelV { width: 170px; vertical-align: middle; }
.main-content td.LabelV label { color: #5e4a15; font-weight: 600; font-size: 13px; }

/* ===== FAQ: akordeon + Getting Started + Server info (2026-10-05 v5) ===== */
.gs-steps { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.gs-step { background: #fffdf7; border: 1px solid #e3d9be; border-radius: 8px; padding: 16px 16px 14px; }
.gs-num { width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(180deg, #d8b23a, #96781f); color: #241b00; font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 15px; margin-bottom: 8px; }
.gs-step h4 { font-family: 'Bebas Neue', Bebas, sans-serif; font-size: 18px; color: #241b00; margin: 0 0 6px; letter-spacing: .8px; }
.gs-step p { font-family: 'Inter', Arial, sans-serif; font-size: 13px; color: #4a3b1e; margin: 0 0 10px; line-height: 1.5; }
@media (max-width: 700px) { .gs-steps { grid-template-columns: 1fr; } }

.faq-sec { font-family: 'Bebas Neue', Bebas, sans-serif; font-size: 20px; color: #8a6d1f; letter-spacing: 1px; margin: 18px 0 10px; padding-bottom: 6px; border-bottom: 1px solid #e3d9be; }
.faq-item { background: #fffdf7; border: 1px solid #e3d9be; border-radius: 8px; margin-bottom: 8px; overflow: hidden; }
.faq-item summary { cursor: pointer; padding: 12px 16px 12px 42px; font-family: 'Inter', Arial, sans-serif; font-weight: 600; font-size: 14px; color: #2b2416; list-style: none; position: relative; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::before { content: '+'; position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; line-height: 17px; text-align: center; border-radius: 50%; background: linear-gradient(180deg, #d8b23a, #96781f); color: #241b00; font-weight: 700; font-size: 13px; }
.faq-item[open] summary::before { content: '\2013'; }
.faq-item summary:hover { background: rgba(201,162,39,.10); }
.faq-item[open] { border-color: #c9a227; }
.faq-a { padding: 2px 16px 14px 42px; }
.faq-a p { font-family: 'Inter', Arial, sans-serif; font-size: 13px; color: #4a3b1e; line-height: 1.55; margin: 0; }
.faq-a a { color: #8a6d1f; font-weight: 600; }

.si-rows { display: flex; flex-direction: column; }
.si-row { display: flex; justify-content: space-between; gap: 14px; padding: 8px 2px; border-bottom: 1px dashed #e3d9be; font-family: 'Inter', Arial, sans-serif; font-size: 13.5px; }
.si-row:last-child { border-bottom: 0; }
.si-row .l { color: #8d7a52; text-transform: uppercase; font-size: 11px; letter-spacing: 1px; font-weight: 700; padding-top: 2px; }
.si-row .v { color: #2b2416; font-weight: 600; text-align: right; }
.si-row .v a { color: #8a6d1f; }
.si-rates { display: flex; gap: 10px; flex-wrap: wrap; margin: 4px 0 10px; }
.si-rate { background: #fffdf7; border: 1px solid #e3d9be; border-radius: 8px; padding: 8px 14px; font-family: 'Inter', Arial, sans-serif; font-size: 13px; color: #4a3b1e; display: inline-flex; gap: 8px; align-items: center; }
.si-rate b { color: #7a611a; font-size: 15px; }
.si-block { margin: 10px 0 4px; }
.si-block h4 { font-family: 'Bebas Neue', Bebas, sans-serif; font-size: 16px; color: #241b00; letter-spacing: .8px; margin: 0 0 6px; }
.si-note { font-family: 'Inter', Arial, sans-serif; font-size: 12px; color: #8d7a52; margin-top: 8px; }
.si-stages { display: flex; flex-wrap: wrap; gap: 6px; }
.si-stages span, .si-stages b { background: #fffdf7; border: 1px solid #e3d9be; border-radius: 20px; padding: 4px 12px; font-family: 'Inter', Arial, sans-serif; font-size: 12px; color: #4a3b1e; font-weight: 400; }

/* --- v36: exp-stages (czysty komunikat bez <br>) --- */
.es-note { font-family: 'Inter', Arial, sans-serif; font-size: 14px; color: #3a3428; margin: 12px 0 4px; }
.es-rate { font-family: 'Inter', Arial, sans-serif; font-size: 14px; color: #3a3428; margin: 0 0 12px; }
.es-rate b { color: #7a611a; font-size: 16px; }

/* Rates & stages — tabele (08.10) */
.si-tables { display: flex; flex-wrap: wrap; gap: 12px; margin: 6px 0 12px; align-items: flex-start; }
.st-col { flex: 1 1 280px; min-width: 260px; display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 768px) { .si-tables { flex-direction: column; } .st-col { min-width: 0; width: 100%; } }
.st-card { background: #fffdf7; border: 1px solid #e3d9be; border-radius: 10px; overflow: hidden; }
.st-hd { font-family: 'Bebas Neue', Bebas, sans-serif; font-size: 14px; letter-spacing: .9px; color: #7a611a; padding: 8px 14px 7px; border-bottom: 1px solid #e3d9be; background: #faf5e8; text-transform: uppercase; }
.st-table { width: 100%; border-collapse: collapse; font-family: 'Inter', Arial, sans-serif; font-size: 13px; }
.st-table td { padding: 6px 14px; border-top: 1px dashed #eee4cc; color: #4a3b1e; }
.st-table tr:first-child td { border-top: 0; }
.st-table td.v { text-align: right; color: #7a611a; font-weight: 700; white-space: nowrap; }
.st-table tr:nth-child(even) { background: #fdf9f0; }