/* Uzunlar Gemicilik webmail — Outlook Web tarzı açık tema (sadece bu domain'de yüklenir) */

:root {
	--ug-navy: #0c1c48;
	--ug-navy-dark: #081430;
	--ug-navy-light: #163166;
	--ug-cyan: #00a3d4;
	--ug-cyan-tint: rgba(0, 163, 212, 0.12);
	--ug-navy-tint: rgba(12, 28, 72, 0.06);
	--ug-border: #e1dfdd;
	--ug-text: #242424;
	--ug-text-soft: #605e5c;
}

html,
body,
input,
select,
textarea,
button {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
	color: var(--ug-text);
}

body {
	background-color: #ffffff !important;
}

/* ================= LOGIN SAYFASI ================= */
body.task-login {
	background-color: #faf9f8 !important;
}

#logo img,
.roundcube-logo {
	max-height: 92px; /* önceki 77px'e göre +%20 */
	width: auto;
}

#login-form,
.al-block {
	background: #ffffff;
	border: 1px solid var(--ug-border);
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}

.button-primary,
button.button-primary,
a.button-primary,
input[type="submit"].button-primary {
	background-color: var(--ug-navy) !important;
	border-color: var(--ug-navy) !important;
	border-radius: 4px !important;
	font-weight: 600;
}

.button-primary:hover,
button.button-primary:hover {
	background-color: var(--ug-navy-light) !important;
	border-color: var(--ug-navy-light) !important;
}

a {
	color: var(--ug-navy);
}

a:hover {
	color: var(--ug-cyan);
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--ug-navy) !important;
	box-shadow: 0 0 0 1px var(--ug-navy) !important;
}

/* ================= ÜST MARKA ŞERİDİ (ug-brand.js tarafından eklenir) ================= */
#layout {
	display: flex !important;
	flex-direction: column !important;
}

#ug-topbar {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	height: 64px;
	min-height: 64px;
	padding: 0 1.1rem;
	background-color: #ffffff;
	border-bottom: 1px solid var(--ug-border);
	flex-shrink: 0;
}

#ug-topbar-logo {
	height: 50px; /* önceki 42px'e göre +%20 */
	width: auto;
}

#ug-topbar-title {
	font-weight: 600;
	color: var(--ug-navy);
	font-size: 1.05rem;
}

#ug-body {
	display: flex;
	flex: 1;
	min-height: 0;
	width: 100%;
}

/* eski, dikey menüdeki logo artık üst şeritte olduğu için gizleniyor */
#layout-menu #logo {
	display: none !important;
}

/* bu kutunun varsayılan koyu (rgb(47,58,63)) arka planı — artık içi boş, beyaza çeviriyoruz */
#layout-menu .popover-header {
	background-color: #ffffff !important;
	border-bottom: 1px solid var(--ug-border) !important;
	min-height: 0 !important;
	height: auto !important;
	padding: 0.35rem 0 !important;
}

#layout-menu .popover-header .button.cancel {
	color: var(--ug-navy) !important;
}

/* alt kısımdaki About/Logout kutusu — temanın varsayılan koyu arka planı, beyaza çeviriyoruz */
.special-buttons {
	background-color: #ffffff !important;
	border-top: 1px solid var(--ug-border) !important;
}

.special-buttons a,
.special-buttons a.button {
	color: var(--ug-navy) !important;
}

.special-buttons a:hover,
.special-buttons a.button:hover {
	background-color: var(--ug-navy-tint) !important;
}

/* karanlık mod butonu tamamen kaldırılıyor — her zaman açık tema */
a.theme.dark,
.special-buttons a.theme {
	display: none !important;
}

/* ================= UYGULAMA GENELİ — Outlook'un beyaz/açık zemini ================= */
#layout-menu,
#taskmenu,
#layout-sidebar,
#layout-list,
#layout-content {
	background-color: #ffffff !important;
}

/* Sol dikey ikon şeridi — Outlook'taki gibi açık zemin, ince sağ kenarlık */
#layout-menu {
	border-right: 1px solid var(--ug-border) !important;
}

#taskmenu .popover-header {
	background-color: #ffffff !important;
	border-bottom: 1px solid var(--ug-border);
	padding: 0.5rem 0;
	display: flex;
	justify-content: center;
}

#logo {
	background: transparent !important;
}

#taskmenu a,
#taskmenu a.button {
	color: var(--ug-navy) !important;
}

#taskmenu a:hover,
#taskmenu a.button:hover {
	background-color: var(--ug-navy-tint) !important;
}

#taskmenu a.selected,
#taskmenu a.button.selected {
	background-color: var(--ug-cyan-tint) !important;
	box-shadow: inset 3px 0 0 var(--ug-navy);
}

#taskmenu .compose a,
#taskmenu a.compose {
	background-color: var(--ug-navy) !important;
	color: #ffffff !important;
	border-radius: 6px;
	margin: 0.4rem;
}

#taskmenu .compose a:hover,
#taskmenu a.compose:hover {
	background-color: var(--ug-navy-light) !important;
}

/* ================= KLASÖR PANELİ ================= */
#layout-sidebar {
	border-right: 1px solid var(--ug-border) !important;
}

#layout-sidebar .header,
#layout-list .header,
#messagelist-header,
#layout-content .header {
	background-color: #ffffff !important;
	border-bottom: 1px solid var(--ug-border) !important;
}

#layout-sidebar .header .header-title,
#layout-list .header-title,
#layout-content .header-title {
	color: var(--ug-navy) !important;
	font-weight: 600;
}

#mailboxlist li > a,
.folderlist li > a {
	color: var(--ug-text) !important;
	border-left: 3px solid transparent;
	border-radius: 0 4px 4px 0;
}

#mailboxlist li.selected > a,
.folderlist li.selected > a {
	background-color: var(--ug-cyan-tint) !important;
	border-left: 3px solid var(--ug-navy) !important;
	color: var(--ug-navy) !important;
	font-weight: 600;
}

#mailboxlist li > a:hover,
.folderlist li > a:hover {
	background-color: var(--ug-navy-tint) !important;
}

#mailboxlist .unreadcount,
.folderlist .unreadcount {
	background-color: var(--ug-navy) !important;
	color: #fff !important;
	border-radius: 10px;
}

/* ================= MESAJ LİSTESİ ================= */
#mailsearchform input,
.searchbar input {
	background-color: #f3f2f1 !important;
	border: 1px solid transparent !important;
	border-radius: 16px !important;
	padding-left: 0.8rem !important;
}

#mailsearchform input:focus {
	background-color: #ffffff !important;
	border-color: var(--ug-navy) !important;
}

.listing.messagelist tr {
	border-bottom: 1px solid #f3f2f1 !important;
}

.listing.messagelist tr td {
	padding-top: 0.6rem !important;
	padding-bottom: 0.6rem !important;
}

.listing.messagelist tr:hover td {
	background-color: #f3f2f1 !important;
}

.listing.messagelist tr.selected td {
	background-color: var(--ug-cyan-tint) !important;
	box-shadow: inset 3px 0 0 var(--ug-navy);
}

.listing.messagelist tr.unread td {
	font-weight: 600;
	color: var(--ug-text);
	box-shadow: inset 3px 0 0 var(--ug-cyan);
}

.listing.messagelist tr.unread.selected td {
	box-shadow: inset 3px 0 0 var(--ug-navy);
}

.listing.messagelist tr .subject {
	color: var(--ug-text);
}

.listing.messagelist tr td.date,
.listing.messagelist tr td.fromto {
	color: var(--ug-text-soft);
}

/* ================= OKUMA BÖLMESİ ================= */
#layout-content .toolbar a.button,
.messageview .toolbar a.button {
	border: none !important;
	border-radius: 4px;
	color: var(--ug-navy) !important;
	background: transparent !important;
}

#layout-content .toolbar a.button:hover,
.messageview .toolbar a.button:hover {
	background-color: var(--ug-navy-tint) !important;
}

#layout-content .toolbar a.button.disabled {
	color: #a19f9d !important;
}

/* ================= GENEL ================= */
::selection {
	background-color: var(--ug-cyan-tint);
}

.badge,
.unreadcount {
	background-color: var(--ug-navy) !important;
}