/**
 * Mobiza hesaplar — Mobiza teması (Planfly) görünümü.
 * Hesap düğmesi: Planfly SidebarMenuButton size="lg" (h-12, p-2, rounded-md, avatar size-8, ad + adres, ChevronsUpDown)
 * Menü: Planfly işletme seçicisi (DropdownMenu: etiket text-xs soluk, öğe gap-2 p-2, Check; "ekle" kesikli kenarlı kutu + Plus)
 * İkonlar temanın "Icons" yazı tipinden (Lucide): f0dc chevrons-up-down, f00c check, f00d x, f067 plus, f87a monitor-smartphone,
 * f011 log-out, f108 monitor, f3cd smartphone, f3fa tablet, f06a circle-alert
 * Renkler Mobiza kimlik paletinden: Gece #0B1B4B, Arduvaz #5B6683, Sis #DCE2EE, hover #E8ECF4, çizgi rgba(11,27,75,.12) (≈ Sis)
 */

.mzacc-chevrons:before,
.mzacc-check:before,
.mzacc-remove:before,
.mzacc-add-icon:before,
.mzacc-error-icon:before,
.mzacc-session-icon:before,
.popover a.mzacc-sessions-link:before,
.popover a.mzacc-logout:before {
    font-family: Icons;
    font-weight: 900;
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    speak: none;
    -webkit-font-smoothing: antialiased;
}

/* Baş harf avatarı (temanın .mz-avatar stiline ek; yalnızca boyut) */
.mzacc-avatar.mz-avatar,
.mzacc-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 32px;
    height: 32px;
    margin: 0;
    font-size: 13px;
    border-radius: 999px;
}

/*** Klasör listesinin üstündeki hesap düğmesi ***/

#layout-sidebar > .header > .header-title.mzacc-title {
    display: flex;
    align-items: center;
    min-width: 0;
    height: 100%;
    padding: 0 !important;
    overflow: visible;
    font-weight: 400;
}

a.mzacc-switcher {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    height: 48px;
    padding: 8px;
    color: #0B1B4B;
    font-size: 14px;
    text-align: left;
    text-decoration: none !important;
    border-radius: 8px;
    outline: 0;
    transition: background-color .12s ease;
    cursor: pointer;
}

a.mzacc-switcher:hover,
a.mzacc-switcher[aria-expanded="true"] {
    color: #0B1B4B;
    background-color: #DCE2EE;
}

a.mzacc-switcher:focus-visible {
    box-shadow: 0 0 0 3px rgba(42, 92, 244, .25);
}

.mzacc-text {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.25;
    text-align: left;
}

.mzacc-name,
.mzacc-email {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mzacc-name {
    font-size: 14px;
    font-weight: 500;
}

.mzacc-email {
    font-size: 12px;
    font-weight: 400;
    color: #5B6683;
}

.mzacc-chevrons {
    flex: none;
    margin-left: auto;
    color: #5B6683;
}

.mzacc-chevrons:before {
    content: "\f0dc";
    display: block;
    font-size: 16px;
}

/*** Hesap menüsü ***/

.popover:has(#mzacc-menu) {
    max-width: 360px;
}

#mzacc-menu {
    min-width: 240px;
}

html.layout-phone #mzacc-menu,
html.layout-small #mzacc-menu {
    min-width: 0;
}

html .popover #mzacc-menu ul.menu li.separator.mzacc-label {
    padding: 6px 8px !important;
    font-size: 12px !important;
    font-weight: 400;
    line-height: 16px !important;
    color: #5B6683;
    border-top: 0 !important;
    margin-top: 0;
}

html .popover #mzacc-menu ul.menu li.mzacc-sep {
    height: 1px;
    margin: 4px -4px;
    padding: 0;
    background-color: rgba(11, 27, 75, .12);
}

html .popover #mzacc-menu ul.menu li a.mzacc-account,
html .popover #mzacc-menu ul.menu li a.mzacc-add {
    gap: 8px;
    padding: 8px;
}

html .popover #mzacc-menu ul.menu li a.mzacc-account:before,
html .popover #mzacc-menu ul.menu li a.mzacc-add:before {
    content: none !important;
    display: none !important;
}

html .popover #mzacc-menu ul.menu li a.mzacc-account.current {
    cursor: default;
}

html .popover #mzacc-menu ul.menu li a .mzacc-text > span {
    min-width: 0;
}

.mzacc-check {
    flex: none;
    margin-left: auto;
    color: #0B1B4B;
}

.mzacc-check:before {
    content: "\f00c";
    display: block;
    font-size: 16px;
}

/* Hesabı bu tarayıcıdan kaldır: üzerine gelince görünür (dokunmatikte hep görünür) */
.mzacc-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 24px;
    height: 24px;
    margin: -4px -2px -4px auto;
    color: #5B6683;
    border-radius: 6px;
    opacity: 0;
    transition: opacity .12s ease, background-color .12s ease, color .12s ease;
    cursor: pointer;
}

.mzacc-remove:before {
    content: "\f00d";
    font-size: 14px;
}

a.mzacc-account:hover .mzacc-remove,
a.mzacc-account:focus .mzacc-remove,
a.mzacc-account:focus-within .mzacc-remove {
    opacity: 1;
}

.mzacc-remove:hover {
    color: #C62F35;
    background-color: rgba(198, 47, 53, .10);
}

@media (hover: none) {
    .mzacc-remove {
        opacity: 1;
    }
}

/* Hesap ekle: kesikli kenarlı kare içinde artı (Planfly "Yeni işletme ekle") */
.mzacc-add-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 32px;
    height: 32px;
    color: #0B1B4B;
    border: 1px dashed rgba(11, 27, 75, .24);
    border-radius: 10px;
}

.mzacc-add-icon:before {
    content: "\f067";
    font-size: 16px;
}

.popover a.mzacc-sessions-link:before {
    content: "\f87a";
}

.popover a.mzacc-logout:before {
    content: "\f011";
}

/*** Hesap ekleme penceresi (Planfly Dialog + Label/Input, form gap-6, alan gap-2) ***/

.mzacc-add-form {
    display: grid;
    gap: 20px;
    margin: 0;
}

.mzacc-dialog-intro {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    color: #5B6683;
}

.mzacc-field {
    display: grid;
    gap: 8px;
}

.mzacc-field label {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    color: #0B1B4B;
}

.mzacc-field .form-control {
    width: 100%;
    height: 40px;
}

/* Planfly AlertError: rounded-lg border px-4 py-3 text-sm, solda 16px ikon */
.mzacc-error {
    display: grid;
    grid-template-columns: 16px 1fr;
    gap: 12px;
    align-items: start;
    padding: 12px 16px;
    font-size: 14px;
    line-height: 20px;
    color: #C62F35;
    background-color: #F8E6E7;
    border: 1px solid rgba(198, 47, 53, .20);
    border-radius: 10px;
}

.mzacc-error[hidden] {
    display: none !important;
}

.mzacc-error-icon:before {
    content: "\f06a";
    display: block;
    margin-top: 2px;
    font-size: 16px;
}

/*** Giriş: "Beni hatırla" (Planfly: flex items-center space-x-3, Checkbox + Label; düğme mt-4) ***/

/* Planfly Checkbox (temanın _controls.less'iyle aynı: 18px, köşe 5px, işaretliyken marka rengi + beyaz Lucide check).
   Elastic'in anahtara çevirmemesi için kutu custom-control-input sınıfı taşıyor; Bootstrap'ın gizlemesi burada geri alınır. */
#login-form input.mz-plain-check {
    position: static;
    left: auto;
    z-index: auto;
    flex: none;
    width: 18px;
    height: 18px;
    margin: 0;
    padding: 0;
    opacity: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    vertical-align: middle;
    background: #fff center / 14px 14px no-repeat;
    border: 1px solid rgba(11, 27, 75, .24);
    border-radius: 5px;
    cursor: pointer;
    transition: box-shadow .15s ease, background-color .15s ease, border-color .15s ease;
}

#login-form input.mz-plain-check:checked {
    background-color: #2A5CF4;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
    border-color: #2A5CF4;
}

#login-form input.mz-plain-check:focus {
    outline: 0;
}

#login-form input.mz-plain-check:focus-visible {
    border-color: #2A5CF4;
    box-shadow: 0 0 0 3px rgba(42, 92, 244, .5);
}

html.dark-mode #login-form input.mz-plain-check {
    background-color: #232A33;
    border-color: rgba(243, 245, 250, .16);
}

html.dark-mode #login-form input.mz-plain-check:checked {
    background-color: #2A5CF4;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
    border-color: #2A5CF4;
}

body.task-login #login-form p.mz-remember {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 4px 0 0 !important;
}

body.task-login #login-form p.mz-remember input {
    flex: none;
    margin: 0;
}

body.task-login #login-form p.mz-remember label {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    color: #0B1B4B;
    cursor: pointer;
    user-select: none;
}

body.task-login #login-form p.mz-remember + p.formbuttons {
    margin-top: 40px !important;
}

/*** Ayarlar › Oturumlar ***/

.listing.iconized li.mzacc-sessions > a:before {
    content: "\f87a";
}

.mzacc-sessions .mzacc-intro {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 20px;
    color: #5B6683;
}

.mzacc-session-list {
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid rgba(11, 27, 75, .12);
    border-radius: 10px;
    overflow: hidden;
}

.mzacc-session {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    padding: 12px 16px;
    border-top: 1px solid rgba(11, 27, 75, .12);
    transition: opacity .15s ease;
}

.mzacc-session:first-child {
    border-top: 0;
}

.mzacc-session.mzacc-leaving {
    opacity: 0;
}

.mzacc-session-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 36px;
    height: 36px;
    color: #5B6683;
    background-color: #F3F5FA;
    border-radius: 10px;
}

.mzacc-session-icon:before {
    font-size: 18px;
}

.mzacc-device-desktop:before {
    content: "\f108";
}

.mzacc-device-mobile:before {
    content: "\f3cd";
}

.mzacc-device-tablet:before {
    content: "\f3fa";
}

.mzacc-session-text {
    flex: 1 1 220px;
    min-width: 0;
}

.mzacc-session-device {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #0B1B4B;
}

.mzacc-session-meta {
    margin-top: 2px;
    font-size: 12px;
    line-height: 18px;
    color: #5B6683;
}

.mzacc-dot {
    margin: 0 2px;
    opacity: .6;
}

/* Planfly Badge (rounded-full px-2 py-0.5 text-xs font-medium), marka tonu */
.mzacc-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    color: #13308F;
    background-color: #EAEFFE;
    border-radius: 999px;
}

.mzacc-session .btn.mzacc-revoke {
    flex: none;
    height: 32px;
    margin-left: auto;
    padding: 0 12px;
    font-size: 14px;
}

.mzacc-session-empty {
    padding: 16px;
    font-size: 14px;
    color: #5B6683;
}

.mzacc-sessions .formbuttons .btn {
    height: 40px;
}

/* Elastic düğmeye btn-secondary de ekliyor; koyu modda o kural baskın gelmesin: her iki modda Planfly destructive */
.btn.btn-danger.mzacc-revoke-all,
html.dark-mode .btn.btn-danger.mzacc-revoke-all {
    color: #fff !important;
    background-color: #C62F35 !important;
    border-color: #C62F35 !important;
}

.btn.btn-danger.mzacc-revoke-all:hover,
.btn.btn-danger.mzacc-revoke-all:focus,
html.dark-mode .btn.btn-danger.mzacc-revoke-all:hover,
html.dark-mode .btn.btn-danger.mzacc-revoke-all:focus {
    background-color: #A8262B !important;
    border-color: #A8262B !important;
}

/* Telefonda Elastic bu düğmeyi alt araç çubuğuna kopyalıyor (ikon + yazı, 84px): çıkış ikonu, tam yazı, destructive renk */
.footer .buttons a.button.mzacc-revoke-all {
    width: auto;
    max-width: none;
    padding-left: 12px;
    padding-right: 12px;
    color: #C62F35;
}

.footer .buttons a.button.mzacc-revoke-all:before {
    content: "\f011";
}

html.dark-mode .footer .buttons a.button.mzacc-revoke-all {
    color: #FF9A9E;
}

/*** Koyu mod (Planfly koyu tokenları) ***/

html.dark-mode a.mzacc-switcher {
    color: #F3F5FA;
}

html.dark-mode a.mzacc-switcher:hover,
html.dark-mode a.mzacc-switcher[aria-expanded="true"] {
    color: #F3F5FA;
    background-color: #303945;
}

html.dark-mode .mzacc-email,
html.dark-mode .mzacc-chevrons,
html.dark-mode .mzacc-remove,
html.dark-mode .mzacc-dialog-intro,
html.dark-mode .mzacc-sessions .mzacc-intro,
html.dark-mode .mzacc-session-meta,
html.dark-mode .mzacc-session-empty,
html.dark-mode .mzacc-session-icon,
html.dark-mode .popover #mzacc-menu ul.menu li.separator.mzacc-label {
    color: #B0BAC6;
}

html.dark-mode .mzacc-check,
html.dark-mode .mzacc-add-icon,
html.dark-mode .mzacc-field label,
html.dark-mode .mzacc-session-device,
html.dark-mode body.task-login #login-form p.mz-remember label {
    color: #F3F5FA;
}

html.dark-mode .popover #mzacc-menu ul.menu li.mzacc-sep,
html.dark-mode .mzacc-session {
    background-color: transparent;
    border-color: rgba(243, 245, 250, .10);
}

html.dark-mode .popover #mzacc-menu ul.menu li.mzacc-sep {
    background-color: rgba(243, 245, 250, .10);
}

html.dark-mode .mzacc-add-icon {
    border-color: rgba(243, 245, 250, .16);
}

html.dark-mode .mzacc-remove:hover {
    color: #FF9A9E;
    background-color: rgba(255, 154, 158, .14);
}

html.dark-mode .mzacc-error {
    color: #FF9A9E;
    background-color: rgba(198, 47, 53, .16);
    border-color: rgba(255, 154, 158, .25);
}

html.dark-mode .mzacc-session-list {
    border-color: rgba(243, 245, 250, .10);
}

html.dark-mode .mzacc-session-icon {
    background-color: #2B333D;
}

html.dark-mode .mzacc-badge {
    color: #B4C6FB;
    background-color: #233548;
}

/*** Telefon ***/

@media (max-width: 480px) {
    .mzacc-session {
        padding: 12px;
    }

    .mzacc-session .btn.mzacc-revoke {
        width: 100%;
        margin-left: 48px;
        width: calc(100% - 48px);
    }
}
