/* ============================================================
   Estilos por-página extraídos dos <style> dos partials Blade
   (login, account, forgot, passreset, rankings). Escopados por
   classe, então carregar global é equivalente ao original.
   ============================================================ */

/* ===== LOGIN ===== */
.login {
    background: rgba(58, 31, 31, 0.95) !important;
    border: 1px solid #5c2f2f;
    border-radius: 10px;
    box-shadow: 0 2px 18px 0 #1a0e0e;
    color: #e0c090;
}
.login h1 { border-bottom: 1px solid #5c2f2f; padding-bottom: 15px; margin-bottom: 20px; }
.login .text { color: #e0c090 !important; font-weight: bold; text-transform: uppercase; }
.login input[type="text"], .login input[type="password"] {
    background: #2a1616 !important;
    border: 1px solid #5c2f2f !important;
    color: white !important;
    padding: 12px;
    border-radius: 5px;
    width: 100%;
    margin-bottom: 15px;
    box-sizing: border-box;
}
.login input:focus { border-color: #e0c090 !important; outline: none; }
.login a { color: #e0c090 !important; text-decoration: none; font-weight: bold; font-size: 14px; transition: color 0.3s; }
.login a:hover { color: #ffffff !important; }
.login .button-login { width: 100%; margin-top: 20px; }
.goldT { float: right; margin-top: -10px; }

/* ===== ACCOUNT ===== */
.account-options {
    background: rgba(58, 31, 31, 0.95);
    border: 1px solid #5c2f2f;
    border-radius: 10px;
    box-shadow: 0 2px 18px 0 #1a0e0e;
    color: #e0c090;
    padding: 25px;
}
.account-options h1 {
    color: #e0c090; text-transform: uppercase; font-size: 18px;
    border-bottom: 1px solid #5c2f2f; padding-bottom: 12px; margin: 0 0 20px 0;
}
.account-options .welcome { font-size: 14px; color: #c9b78a; margin-bottom: 20px; }
.account-options .welcome strong { color: #ffffff; }
.account-stats { display: flex; gap: 12px; margin-bottom: 22px; }
.account-stats .stat-card {
    flex: 1; background: #2a1616; border: 1px solid #5c2f2f; border-radius: 8px;
    padding: 18px 22px; text-align: center; transition: border-color 0.3s, transform 0.2s;
}
.account-stats .stat-card:hover { border-color: #e0c090; transform: translateY(-2px); }
.account-stats .stat-label { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: #c9b78a; margin-bottom: 8px; }
.account-stats .stat-value { font-size: 28px; font-weight: bold; color: #e0c090; line-height: 1; }
.account-stats .stat-card.rc .stat-value { color: #f4d088; }
.account-stats .stat-card.gift .stat-value { color: #c8a8e8; }
.account-options .option-card {
    display: flex; align-items: center; justify-content: space-between;
    background: #2a1616; border: 1px solid #5c2f2f; border-radius: 8px;
    padding: 18px 22px; margin-bottom: 12px; transition: background 0.3s, border-color 0.3s, transform 0.2s;
}
.account-options .option-card:hover { background: #3a1f1f; border-color: #e0c090; transform: translateY(-2px); }
.account-options .option-info h3 { margin: 0 0 4px 0; font-size: 16px; color: #e0c090; text-transform: uppercase; }
.account-options .option-info p { margin: 0; font-size: 13px; color: #c9b78a; }
.account-options .option-action a, .account-options .option-action button {
    background: #5c2f2f; color: #e0c090; border: 1px solid #3a1f1f; text-transform: uppercase;
    font-weight: bold; border-radius: 6px; padding: 10px 22px; font-size: 14px; cursor: pointer;
    text-decoration: none; display: inline-block; transition: background 0.3s, color 0.3s, border-color 0.3s; font-family: inherit;
}
.account-options .option-action a:hover, .account-options .option-action button:hover { background: #e0c090; color: #3a1f1f; border-color: #e0c090; }
.account-options form { margin: 0; }
.account-sidebar { position: relative; left: -60px; }

/* ===== FORGOT ===== */
.forgot {
    background: rgba(58, 31, 31, 0.95); border: 1px solid #5c2f2f; border-radius: 10px;
    box-shadow: 0 2px 18px 0 #1a0e0e; color: #e0c090; padding: 25px;
}
.forgot h1 { color: #e0c090; text-transform: uppercase; font-size: 18px; border-bottom: 1px solid #5c2f2f; padding-bottom: 12px; margin: 0 0 12px 0; }
.forgot .subtitle { font-size: 14px; color: #c9b78a; margin-bottom: 22px; line-height: 1.5; }
.forgot label { display: block; font-weight: bold; font-size: 12px; text-transform: uppercase; color: #e0c090; margin: 14px 0 6px 0; }
.forgot input[type="text"], .forgot input[type="email"] {
    background: #2a1616 !important; border: 1px solid #5c2f2f !important; color: #ffffff !important;
    padding: 12px; border-radius: 5px; width: 100%; box-sizing: border-box;
}
.forgot input:focus { border-color: #e0c090 !important; outline: none; }
.forgot .error { color: #ff6b6b; font-size: 13px; font-weight: bold; display: block; margin-top: 4px; }
.forgot .actions { display: flex; gap: 12px; margin-top: 22px; }
.forgot .btn-primary, .forgot .btn-secondary {
    flex: 1; text-transform: uppercase; font-weight: bold; border-radius: 6px; padding: 12px 20px; font-size: 14px;
    cursor: pointer; text-decoration: none; text-align: center; display: inline-block;
    transition: background 0.3s, color 0.3s, border-color 0.3s; font-family: inherit; border: 1px solid #3a1f1f;
}
.forgot .btn-primary { background: #5c2f2f; color: #e0c090; }
.forgot .btn-primary:hover { background: #e0c090; color: #3a1f1f; border-color: #e0c090; }
.forgot .btn-secondary { background: transparent; color: #c9b78a; border-color: #5c2f2f; }
.forgot .btn-secondary:hover { background: #2a1616; color: #ffffff; border-color: #e0c090; }

/* ===== PASSRESET ===== */
.passreset {
    background: rgba(58, 31, 31, 0.95); border: 1px solid #5c2f2f; border-radius: 10px;
    box-shadow: 0 2px 18px 0 #1a0e0e; color: #e0c090; padding: 25px;
}
.passreset h1 { color: #e0c090; text-transform: uppercase; font-size: 18px; border-bottom: 1px solid #5c2f2f; padding-bottom: 12px; margin: 0 0 20px 0; }
.passreset .subtitle { font-size: 14px; color: #c9b78a; margin-bottom: 20px; }
.passreset .subtitle strong { color: #ffffff; }
.passreset label { display: block; font-weight: bold; font-size: 12px; text-transform: uppercase; color: #e0c090; margin: 14px 0 6px 0; }
.passreset input[type="password"], .passreset input[type="text"] {
    background: #2a1616 !important; border: 1px solid #5c2f2f !important; color: #ffffff !important;
    padding: 12px; border-radius: 5px; width: 100%; box-sizing: border-box;
}
.passreset input:focus { border-color: #e0c090 !important; outline: none; }
.passreset .error { color: #ff6b6b; font-size: 13px; font-weight: bold; display: block; margin-top: 4px; }
.passreset .actions { display: flex; gap: 12px; margin-top: 22px; }
.passreset .btn-primary, .passreset .btn-secondary {
    flex: 1; text-transform: uppercase; font-weight: bold; border-radius: 6px; padding: 12px 20px; font-size: 14px;
    cursor: pointer; text-decoration: none; text-align: center; display: inline-block;
    transition: background 0.3s, color 0.3s, border-color 0.3s; font-family: inherit;
}
.passreset .btn-primary { background: #5c2f2f; color: #e0c090; border: 1px solid #3a1f1f; }
.passreset .btn-primary:hover { background: #e0c090; color: #3a1f1f; border-color: #e0c090; }
.passreset .btn-secondary { background: transparent; color: #c9b78a; border: 1px solid #5c2f2f; }
.passreset .btn-secondary:hover { background: #2a1616; color: #ffffff; border-color: #e0c090; }

/* ===== RANKINGS TABS ===== */
.nav-pills .nav-link {
    color: #e0c090 !important; background: #5c2f2f; border: 1px solid #3a1f1f; border-radius: 5px;
    font-weight: bold; text-transform: uppercase; transition: all 0.3s ease; box-shadow: 0 2px 5px 0 #1a0e0e; margin: 0 3px;
}
.nav-pills .nav-link.active { background: #e0c090 !important; color: #3a1f1f !important; border: 1px solid #b89c72; box-shadow: 0 0 8px #e0c09044; }
.nav-pills .nav-link.disabled { opacity: 0.6; background: #2a1616 !important; color: #5c2f2f !important; cursor: not-allowed; border: 1px solid #1a0e0e; }
.nav-pills .nav-link:hover:not(.active):not(.disabled) { background: #3a1f1f; color: #ffffff !important; border-color: #e0c090; }
#ranking-donator-tab, #ranking-pvp-tab { display: none; }
.nav-pills .nav-link { cursor: pointer; }

/* ===== DOWNLOAD ===== */
.download-buttons { display: flex; justify-content: center; gap: 30px; padding: 50px 20px; }
.download-buttons a img { border: none; transition: transform 0.3s ease; max-width: 100%; height: auto; }
.download-buttons a img:hover { transform: scale(1.1); }

/* ===== FONTES usadas em páginas específicas ===== */
@font-face { font-family: 'GoodTimesBold'; src: url('../fonts/goodtimes.ttf'); }
@font-face { font-family: 'GeometricSerif'; src: url('../fonts/geometric.otf'); }

/* ===== DONATION / CRÉDITOS ===== */
.form-container { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(0,0,0,0.9); padding: 40px; border-radius: 10px; text-align: center; box-shadow: 0px 4px 15px rgba(0,0,0,0.5); z-index: 100; width: 80%; max-width: 1200px; }
.title-container { color: white; text-transform: uppercase; font-size: 36px; font-family: 'GoodTimesBold', sans-serif; text-shadow: 3px 3px 6px rgba(0,0,0,0.7); margin-bottom: 20px; }
.currency-selector-container { display: flex; justify-content: center; gap: 20px; margin-bottom: 30px; }
.shining-text { color: white; text-transform: uppercase; font-size: 18px; font-family: 'Roboto', sans-serif; font-weight: bold; text-align: center; margin-bottom: 20px; text-shadow: 1px 1px 2px rgba(0,0,0,0.3); transition: text-shadow 0.5s ease-in-out; }
.shining-text:hover { text-shadow: 2px 2px 5px rgba(255,255,255,0.8); }
.package-container { display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: repeat(2, auto); gap: 20px; justify-content: center; align-items: center; max-width: 100%; }
.package { text-align: center; background: rgba(255,255,255,0.1); padding: 20px; border-radius: 10px; }
.package p { font-size: 16px; font-weight: bold; color: white; white-space: nowrap; display: flex; justify-content: center; gap: 5px; align-items: center; }
.button-request { display: flex; justify-content: center; align-items: center; width: 140px; height: 45px; font-size: 16px; background-color: #007bff; border: none; cursor: pointer; border-radius: 5px; color: white !important; font-family: 'GoodTimesBold', sans-serif; text-align: center; text-decoration: none; transition: background-color 0.3s ease, transform 0.2s; margin: 0 auto; }
.button-request:hover { background-color: #ff8c00; transform: scale(1.05); }
.currency-toggle { padding: 15px 30px; font-size: 14px; border: 2px solid transparent; background-color: #007bff; color: white; border-radius: 5px; cursor: pointer; font-family: 'GoodTimesBold', sans-serif; transition: all 0.3s ease; }
.currency-toggle:hover { background-color: #ff8c00; }
.currency-toggle.active { background-color: #ff8c00; border-color: white; transform: scale(1.1); }
.modal { display: none; position: fixed; z-index: 1050; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.7); }
.modal.is-open { display: block; }
.modal-content { background: rgba(0,0,0,0.9); margin: 10% auto; padding: 20px; width: 50%; box-shadow: 0 4px 8px rgba(0,0,0,0.2); text-align: center; color: white; border-radius: 8px; }
.currency-button { background-color: #007bff; border: 2px solid transparent; color: white !important; padding: 10px 20px; font-size: 16px; cursor: pointer; border-radius: 5px; margin: 5px; font-weight: bold; transition: all 0.3s ease; }
.currency-button:hover { background-color: #ff8c00; border-color: white; }
.button-continue { width: 200px; height: 60px; background-color: #007bff; border: none; cursor: pointer; border-radius: 5px; color: white !important; font-size: 20px; font-family: 'GoodTimesBold', sans-serif; text-align: center; transition: background-color 0.3s ease; margin-top: 15px; }
.button-continue:hover { background-color: #ff8c00; }
.button-continue:disabled { background-color: #555; color: #aaa !important; cursor: not-allowed; }
.modal-body { margin-top: 20px; margin-bottom: 20px; text-align: left; max-height: 400px; overflow-y: auto; padding: 10px; }
.terms-check { margin-top: 20px; display: flex; align-items: center; justify-content: center; gap: 10px; }
