/* SafeSeafood V17.4 public authentication/account polish.
   Admin screens intentionally do not load this file. */
:root {
    --ss-public-navy: #0b3f62;
    --ss-public-ocean: #087eae;
    --ss-public-teal: #2fa9ad;
    --ss-public-ice: #f2f8fb;
    --ss-public-muted: #587184;
}

.ss-auth-page.auth-section,
.auth-section.ss-auth-page {
    margin-top: 76px !important;
    min-height: calc(100vh - 76px);
    padding: clamp(42px, 7vw, 84px) 0;
    background: var(--ss-public-ice);
    align-items: flex-start;
}

.ss-auth-page .auth-wrapper { max-width: 500px; }
.ss-auth-page .auth-card {
    border: 1px solid #dceaf0;
    border-radius: 20px;
    padding: clamp(24px, 4vw, 42px);
    box-shadow: 0 16px 38px rgba(6, 63, 98, .09);
}
.ss-auth-page .auth-header h3 { color: var(--ss-public-navy); font-weight: 800; letter-spacing: -.025em; }
.ss-auth-page .auth-header p,
.ss-auth-page .auth-footer p,
.ss-auth-page .forgot-link { color: var(--ss-public-muted); }
.ss-auth-page .form-group label { color: var(--ss-public-navy); font-weight: 600; }
.ss-auth-page .input-with-icon .form-control:focus { border-color: var(--ss-public-ocean); box-shadow: 0 0 0 3px rgba(8, 126, 174, .12); }
.ss-auth-page .btn-submit { background: var(--ss-public-ocean); border-radius: 10px; }
.ss-auth-page .btn-submit:hover { background: #06678f; }
.ss-auth-page .btn-register,
.ss-auth-page .btn-login-link { color: var(--ss-public-navy); border-radius: 10px; }
.ss-auth-page .btn-register:hover,
.ss-auth-page .btn-login-link:hover { color: var(--ss-public-ocean); border-color: #9bd3e2; background: #f4fbfd; }
.ss-auth-page .alert-error { border-radius: 10px; }
#google_translate_element,
.goog-te-gadget,
.goog-te-banner-frame,
.skiptranslate { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; opacity: 0 !important; pointer-events: none !important; }
body { top: 0 !important; }

.header-account-menu { z-index: 1201; }
.header-account-menu[open] summary { color: var(--ss-public-ocean); }
.ss-header__controls { order: 3; display: inline-flex; align-items: center; gap: 14px; margin-left: auto; }
.ss-header__login { display: inline-flex; align-items: center; gap: 6px; color: var(--ss-public-navy); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-decoration: none; white-space: nowrap; }
.ss-header__login:hover { color: var(--ss-public-ocean); }
.ss-account-menu { position: relative; color: var(--ss-public-navy); }
.ss-account-menu summary { display: inline-flex; align-items: center; gap: 7px; list-style: none; cursor: pointer; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.ss-account-menu summary::-webkit-details-marker { display: none; }
.ss-account-menu summary i { color: var(--ss-public-ocean); font-size: 11px; }
.ss-account-menu__dropdown { position: absolute; top: calc(100% + 12px); right: 0; min-width: 190px; padding: 8px; background: #fff; border: 1px solid #dceaf0; border-radius: 12px; box-shadow: 0 14px 35px rgba(6,63,98,.14); z-index: 1200; }
.ss-account-menu__dropdown a { display: block; padding: 9px 11px; border-radius: 8px; color: #294b65; font-size: 13px; line-height: 1.2; text-decoration: none; }
.ss-account-menu__dropdown a:hover, .ss-account-menu__dropdown a:focus-visible { color: var(--ss-public-ocean); background: #eef8fb; }
.ss-account-menu__dropdown .ss-account-menu__signout { margin-top: 4px; border-top: 1px solid #edf2f5; color: #b54747; }
.ss-language { position: relative; display: inline-flex; align-items: center; }
.ss-language__toggle { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 8px; border: 1px solid #d5e6ef; border-radius: 9px; background: #fff; color: var(--ss-public-navy); font: 700 11px/1.2 inherit; cursor: pointer; }
.ss-language__toggle img, .ss-language__menu img { display: block; width: 24px; height: 16px; object-fit: cover; border-radius: 2px; }
.ss-language__toggle i { font-size: 9px; color: var(--ss-public-ocean); }
.ss-language__menu { position: absolute; top: calc(100% + 8px); right: 0; width: 184px; padding: 5px; border: 1px solid #e2edf2; border-radius: 13px; background: #fff; box-shadow: 0 14px 36px rgba(23,50,77,.16); z-index: 1200; }
.ss-language__menu button { display: grid; grid-template-columns: 24px minmax(0,1fr) auto; align-items: center; gap: 8px; width: 100%; min-height: 42px; padding: 7px 9px; border: 0; border-radius: 9px; background: #fff; color: var(--ss-public-navy); text-align: left; cursor: pointer; }
.ss-language__menu button:hover, .ss-language__menu button.is-active { background: #eff9fc; color: var(--ss-public-ocean); }
.ss-language__menu strong { font-size: 11px; color: #718096; }
.tml-menu__account-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.tml-menu__account-links a { color: #fff; font: 700 13px/1.2 Montserrat,sans-serif; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.tml-menu__account-links a:hover { color: var(--ss-public-teal); }
.tml-menu__languages { display: none; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 18px; color: #fff; font: 700 13px/1.2 Montserrat,sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.tml-menu__languages button { padding: 7px 9px; border: 1px solid rgba(255,255,255,.32); border-radius: 7px; background: transparent; color: #fff; font: inherit; cursor: pointer; }
.tml-menu__languages button:hover, .tml-menu__languages button.is-active { background: var(--ss-public-ocean); border-color: var(--ss-public-ocean); }
.haisan-language-toggle:focus-visible,
.haisan-language-option:focus-visible,
.header-account-menu summary:focus-visible { outline: 3px solid rgba(8, 126, 174, .25); outline-offset: 3px; }

@media (max-width: 767px) {
    .ss-auth-page.auth-section,
    .auth-section.ss-auth-page { margin-top: 76px !important; min-height: calc(100vh - 76px); padding: 28px 14px 52px; }
    .ss-auth-page .auth-card { border-radius: 16px; padding: 24px 20px; }
}
@media (max-width: 900px) {
    .ss-header__controls { display: none; }
    .tml-menu__languages { display: flex; }
}