/* --- layout.css --- */
html, body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	overflow: hidden;
	background-color: #000000; /* Arka planı zifiri siyah yap */
}

/* CUSTOM SCROLLBARS FOR GOTHIC LOOK */
::-webkit-scrollbar {
    width: 16px;
    height: 16px;
    background: #111;
}
::-webkit-scrollbar-thumb {
    background: #500; /* Kan kırmızısı */
    border: 1px solid #000;
    box-shadow: inset 1px 1px 0 #900, inset -1px -1px 0 #300;
}
::-webkit-scrollbar-button {
    background: #222;
    color: red;
    height: 16px;
    width: 16px;
}
::-webkit-scrollbar-corner {
    background: #000;
}

.start-menu {
	position: absolute !important;
	left: 2px;
	bottom: 25px;
	width: calc(186px + 21px); 
	height: 340px;
	max-height: calc(100vh - 26px);
	box-sizing: border-box;
	display: flex;
	flex-direction: row;
    box-shadow: 4px 4px 10px rgba(0,0,0,0.8); /* Derinlik */
}
.start-menu-titlebar {
	flex: 0 0 auto;
	width: 21px;
}	
.start-menu-content {
	overflow: auto;
	padding: 15px;
}
.start-menu ul {
	list-style: none;
	margin: 1em 0;
	padding: 0;
}
.desktop {
	height: 100%;
	display: flex;
}
.folder-view {
	position: relative;
	flex: 1;
	overflow: auto;
}
.desktop .folder-view {
	overflow: hidden;
}
.taskbar {
	position: absolute;
	z-index: 2;
	bottom: 0;
	left: 0;
	right: 0;
	height: 27px;
	display: flex;
	flex: 1;
}
.taskbar button,
.taskbar-divider,
.tray {
	margin: 2px;
}
.taskbar-divider {
	margin-right: 0px;
	margin-left: 0px;
}
.taskbar button {
	line-height: 14px;
	padding: 2px;
	overflow: hidden;
	display: flex;
	flex-direction: row;
	align-items: center;
}
.taskbar button .title {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.taskbar .start-button {
	flex-shrink: 0;
	padding: 2px 4px;
	font-weight: bold;
	letter-spacing: 1px;
}
.tray {
	display: flex;
	flex-direction: row;
	line-height: 22px;
	box-sizing: border-box;
	vertical-align: middle;
}
.tray-icons {
	display: flex;
	align-items: center;
	margin-left: 2px;
}
.tray-icon {
	margin-left: 1px;
	filter: invert(1) grayscale(1); /* İkonları beyaza çevir */
}
.taskbar-time {
	width: 60px;
	text-align: center;
}
.tasks {
	display: flex;
	flex: 1;
	height: 100%;
	min-width: 0;
}
.task {
	max-width: 200px;
	width: 50%;
	text-align: left;
}
.task img {
	padding-right: 4px;
	flex: 0 0 auto;
	filter: grayscale(100%) brightness(200%); /* Gri/Beyaz ikonlar */
}
.desktop,
.folder-view,
.taskbar,
.start-button,
.tasks,
.task,
.os-window,
.window-titlebar,
.window-title {
	cursor: default;
	user-select: none;
	-o-user-select: none;
	-ms-user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
}
.os-window {
	display: flex;
	flex-direction: column;
	box-shadow: 10px 10px 30px #000000; /* Koyu gölge */
}
.window-titlebar .icon {
	vertical-align: bottom;
	filter: invert(1);
}
.window-content {
	margin: 0;
	padding: 0;
	flex: 1;
}
.desktop-icon {
	display: inline-block;
	vertical-align: bottom;
	text-align: center;
}
.desktop-icon .icon-wrapper {
	display: inline-block;
	vertical-align: bottom;
	position: relative;
    /* Goth efekti: ikonları biraz karart ve kırmızıya çal */
    filter: contrast(1.2) sepia(1) hue-rotate(-50deg) saturate(3);
}
.desktop-icon .icon-wrapper,
.desktop-icon .icon-wrapper .selection-effect {
	width: var(--icon-size, 32px);
	height: var(--icon-size, 32px);
}
.desktop-icon .title {
	line-height: 13px;
	font-size: 9px;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
	overflow-wrap: break-word;
	text-shadow: 1px 1px 0 #000; /* Okunabilirlik için gölge */
}
.desktop-icon:not(.focused) .title {
	max-height: calc(13px * 2);
}
.desktop-icon.focused {
	z-index: 1;
}
.desktop-icon .title input {
	display: flex;
	width: 100%;
}
.drag iframe {
	pointer-events: none;
}
.marquee {
	pointer-events: none;
}
.window-content .button-group {
	width: 85px;
}
.window-content .button-group > button {
	width: 95%;
	padding: 3px 5px;
}
.help-window .window-content {
	display: flex;
	flex-flow: column;
}
.help-window .main {
	flex: 1;
	display: flex;
	flex-flow: row;
}
.help-window .toolbar button {
	width: 55px;
	height: 40px;
	padding: 0;
}
.help-window .toolbar button span {
	display: inline-flex;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	font-size: 12px;
	white-space: pre;
	justify-content: center;
}
.help-window .toolbar button {
	position: relative;
}
.help-window .toolbar button .icon {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
    filter: invert(1);
}
.help-window .contents {
	background: var(--Window); /* White yerine değişken kullan */
	color: var(--WindowText);
	flex-basis: 300px;
	flex-grow: 0;
	flex-shrink: 0;
	overflow: auto;
}
.help-window ul {
	margin: 0;
	padding: 0;
}
.help-window li {
	display: block;
	white-space: nowrap;
}
.help-window .item {
	display: inline-block;
}
.help-window .folder:not(.expanded) ul {
	display: none;
}
.help-window iframe {
	flex: 1;
	width: 0;
    filter: invert(1) hue-rotate(180deg); /* Web içeriğini de karanlık yap */
}
.help-window li ul {
	padding-left: 16px;
}
.help-window li:before {
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 16px;
	height: 16px;
	background-position: 0 0;
	margin-right: 2px;
    filter: invert(1);
}
.help-window .folder.expanded:before {
	background-position: -16px 0;
}
.help-window .page:before {
	background-position: -32px 0;
}
::before, ::after {
	pointer-events: none;
}
.cursor-bully * {
	cursor: inherit !important;
}
.loading-program * {
	cursor: progress;
}
#webamp-context-menu {
	z-index: 5000000 !important;
}
