/* v50.11 — ZERO-STROKE TONAL SURFACES
   A shared visual contract for every Cloud page (including public previews).
   Loaded after legacy styles.  Two :not() qualifiers intentionally outrank
   legacy !important border/outline/1px inset shadow rules without rewriting
   their business-specific positioning and layout rules.  SVG icon paths and
   canvas graphics remain untouched. Keyboard focus uses filled tonal states.
*/
:root{
 --tonal-base:#191B1D;
 --tonal-surface:#212427;
 --tonal-card:#25282B;
 --tonal-hover:#2C3033;
 --tonal-selected:#343B42;
 --tonal-input:#25292C;
 --tonal-menu:#2A2D30;
 --tonal-label:#373E44;
 --tonal-label-text:#E4EAF0;
 --tonal-soft-shadow:0 10px 28px rgba(0,0,0,.17);
}
html[data-theme="modern_light"],html[data-theme="gray_light"],html[data-theme="arctic"],html[data-theme="rose"],html[data-theme="sand"],html[data-theme="light"]{
 --tonal-base:#FFFFFF;
 --tonal-surface:#F6F7F8;
 --tonal-card:#F0F2F4;
 --tonal-hover:#E9ECEF;
 --tonal-selected:#DDE8F5;
 --tonal-input:#F1F3F5;
 --tonal-menu:#F4F5F7;
 --tonal-label:#E7EAF0;
 --tonal-label-text:#28333E;
 --tonal-soft-shadow:0 12px 26px rgba(18,23,30,.07);
}
/* True absence of drawn borders, including fieldsets, pseudoelements, focus
   outlines and simulated 1px inset strokes, across every UI module.
   Do not apply these to SVG paths: those strokes are the actual icons.
*/
html:root:not(#stroke-exception):not(#stroke-exception),
html:root:not(#stroke-exception):not(#stroke-exception) body,
html:root:not(#stroke-exception):not(#stroke-exception) body *,
html:root:not(#stroke-exception):not(#stroke-exception) body *::before,
html:root:not(#stroke-exception):not(#stroke-exception) body *::after{
 border-width:0!important;
 border-style:none!important;
 outline-width:0!important;
 outline-style:none!important;
 box-shadow:none!important;
}
/* Physical separators are surfaces, never a line. */
html body hr{border:0!important;height:8px!important;background:var(--tonal-surface)!important;border-radius:8px}
html body .app-sidebar{background:var(--sidebar-bg)!important}
html body .page-shell,html body main{border:0!important}
/* Actionable tonal surfaces: low key at rest, visibly deeper when pressed. */
html body :is(button,input,textarea,select,.ghost,.primary,.btn,.control):not(.preview):not(.filecard):not(.drive-file-glyph):not(.drive-kind-tile){border:0}
html body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),textarea,select){background-color:var(--tonal-input)}
html body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="color"]),textarea,select):focus-visible{background-color:var(--tonal-selected)!important}
html body :is(button,a,[role="button"],input,select,textarea,[tabindex]):focus-visible:not(:disabled){background-color:var(--tonal-selected)!important;filter:brightness(1.1);text-decoration:none}
html body :is(button,a,[role="button"],[tabindex]):active:not(:disabled){filter:brightness(.94)}
/* Draw the checked state with a fill; no ring/inner line. */
html body :is(.drive-selected,.filecard.selected,.selected-row,.is-selected,[aria-selected="true"]){background-color:var(--tonal-selected)!important}
html body :is(.drive-item-check:checked + span, .drive-select-box input:checked + span){background-color:var(--accent)!important;color:white!important}
/* Menus/panels use differentiated solids instead of sharp separators. */
html body :is(dialog,.drive-sort-menu,.drive-context-menu,.global-context-menu,.drive-selection-more-menu,.drive-new-menu,.workspace-menu,.chat-context-menu,.message-context-menu,.kanban-item-menu,.work-card-dropdown,.sheet2-context,.sheet2-menu-pop,.share-menu,.global-search-results,.cloud-preview-drawer){background-color:var(--tonal-menu)!important}
html body :is(.drive-sort-menu,.drive-context-menu,.global-context-menu,.drive-selection-more-menu,.drive-new-menu,.workspace-menu,.chat-context-menu,.message-context-menu,.kanban-item-menu,.work-card-dropdown,.sheet2-context,.sheet2-menu-pop,.share-menu) :is(button,a,[role="menuitem"]):hover{background-color:var(--tonal-selected)!important}
/* Tables and admin rows: grouped tones instead of thin grid lines. */
html body :is(table,thead,tbody,tr,th,td){border:0!important}
html body table thead,html body :is(.sheet2-grid-header,.drive-list-header,.wt-table-header){background-color:var(--tonal-surface)!important}
html body table tbody tr:nth-child(even){background-color:color-mix(in srgb,var(--tonal-surface) 60%,transparent)}
html body table tbody tr:hover{background-color:var(--tonal-hover)!important}
/* File card hierarchy; the thumbnail is independent of text/metadata. */
html body.route-gallery #driveDropTarget .filecard.file-tile{background-color:var(--tonal-surface)!important;overflow:hidden}
html body.route-gallery #driveDropTarget .filecard.file-tile:hover{background-color:var(--tonal-hover)!important}
html body.route-gallery #driveDropTarget .filecard.file-tile.drive-selected,
html body.route-gallery #driveDropTarget .filecard.file-tile.selected{background-color:var(--tonal-selected)!important}
html body.route-gallery #driveDropTarget .filecard.file-tile > .preview{background-color:var(--tonal-base)!important}
html body.route-gallery #driveDropTarget .filecard.file-tile > .file-meta-row{background-color:transparent!important}
/* Format is written inside the info row, not floated over the picture. */
html body.route-gallery #driveDropTarget .filecard.file-tile > .preview .filetype-corner{display:none!important}
html body.route-gallery #driveDropTarget .filecard.file-tile .fileinfo .drive-card-details{
 display:flex!important;align-items:center!important;gap:6px!important;
 min-width:0!important;overflow:hidden!important;white-space:nowrap!important;
 margin-top:2px!important;font-size:10.4px!important;line-height:1.55!important;
}
html body.route-gallery #driveDropTarget .filecard.file-tile .drive-card-format{
 display:inline-block;flex:none;max-width:52px;min-width:0;overflow:hidden;text-overflow:ellipsis;
 padding:1px 5px;border-radius:5px;background:var(--tonal-label)!important;
 color:var(--tonal-label-text)!important;font-size:9.1px;font-weight:770;
 line-height:1.55;letter-spacing:.01em;text-transform:uppercase;
}
html body.route-gallery #driveDropTarget .filecard.file-tile .drive-card-details-text{
 flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
 color:var(--metadata);
}
/* Active folder and file selections should not require a 1px ring. */
html body.route-gallery #driveDropTarget .filecard.drive-folder-card.drive-selected,
html body.route-gallery #driveDropTarget .filecard.drive-folder-card.selected{background:var(--tonal-selected)!important}
html body.route-gallery #driveDropTarget .filecard.file-tile > .video-poster > .video-play-badge{background:rgba(14,18,20,.78)!important;color:#fff!important}
/* Toasts, cards, content groups: flat silhouettes with discreet elevation via tone. */
html body :is(.usercard,.app-card,.theme-card,.vault-card,.scheduled-item,.share-center-row,.work-card,.kanban-column,.kanban-card):not(.selected):hover{background-color:var(--tonal-hover)!important}
html body :is(.drive-quick-action,.drive-layout-option,.drive-more-btn,.sidebar-search-trigger,.sidebar-collapse-toggle):hover{background-color:var(--tonal-hover)!important}
html body :is(.drive-layout-option.active,.workspace-link.active,.sidebar-nav a.active,.drive-sort-options button.active){background-color:var(--tonal-selected)!important}
/* Never obscure content with a fake border overlay. */
html body :is(.filecard,.preview,.preview.image-preview,.video-poster,.drive-folder-card){background-clip:padding-box}
@media (max-width:800px){
 html body.route-gallery #driveDropTarget:not(.list-view) .filecard.file-tile{background-color:var(--tonal-surface)!important}
 html body.route-gallery #driveDropTarget:not(.list-view) .filecard.file-tile .drive-card-format{font-size:9px!important}
 html body.route-gallery #driveDropTarget:not(.list-view) .filecard.file-tile .drive-card-details{gap:5px!important}
}

/* The mobile grid has its own caption component; keep type visible there too.
   List view still owns a native type column, so avoid a second pill in rows. */
@media (max-width:800px){
 html body.route-gallery #driveDropTarget[data-mobile-view="grid"] .mobile-drive-copy .mobile-drive-filemeta{
   display:flex!important;align-items:center!important;gap:5px!important;
   margin-top:3px!important;min-width:0!important;overflow:hidden!important;
 }
 html body.route-gallery #driveDropTarget[data-mobile-view="grid"] .mobile-drive-copy .drive-mobile-format{
   display:inline-flex!important;align-items:center;flex:0 0 auto;
   padding:1px 5px!important;border-radius:4px;background:var(--tonal-label)!important;
   color:var(--tonal-label-text)!important;font-size:9px!important;font-weight:740!important;
   line-height:1.5!important;text-transform:uppercase;
 }
 html body.route-gallery #driveDropTarget[data-mobile-view="grid"] .mobile-drive-copy .mobile-drive-type,
 html body.route-gallery #driveDropTarget[data-mobile-view="grid"] .mobile-drive-copy .mobile-drive-meta-dot{display:none!important}
 html body.route-gallery #driveDropTarget[data-mobile-view="grid"] .mobile-drive-copy .mobile-drive-date{
   flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
 }
 html body.route-gallery #driveDropTarget[data-mobile-view="list"] .mobile-drive-copy .drive-mobile-format{display:none!important}
}


/* v50.12 — collapsed sidebar simplification: keep the compact rail calm. */
@media (min-width:801px){
 html body .sidebar-compact-more-wrap{display:none;position:relative;justify-content:center;margin:8px 0 2px}
 html body .sidebar-compact-more-toggle{width:38px;height:38px;min-width:38px;min-height:38px;padding:0;border:0;border-radius:10px;background:transparent;color:var(--sidebar-icon);display:grid;place-items:center;margin-inline:auto}
 html body .sidebar-compact-more-toggle svg{width:16px;height:16px;fill:currentColor;stroke:none}
 html body .sidebar-compact-more-toggle:hover,
 html body .sidebar-compact-more-toggle.open,
 html body .sidebar-compact-more-toggle.has-active{background:var(--tonal-selected)!important;color:var(--text)!important}
 html body .sidebar-compact-more-menu{position:absolute;left:46px;bottom:0;min-width:214px;padding:6px;border-radius:12px;background:var(--tonal-menu)!important;box-shadow:var(--tonal-soft-shadow)!important;display:grid;gap:2px;z-index:2400}
 html body .sidebar-compact-more-menu[hidden]{display:none!important}
 html body .sidebar-compact-more-link{height:38px;padding:0 10px;border-radius:9px;display:grid;grid-template-columns:18px minmax(0,1fr);align-items:center;gap:10px;text-decoration:none;color:var(--text)!important;background:transparent}
 html body .sidebar-compact-more-link svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:1}
 html body .sidebar-compact-more-link:hover,
 html body .sidebar-compact-more-link.active{background:var(--tonal-selected)!important}
 html body .sidebar-collapsed .sidebar-compact-more-wrap{display:flex}
 html body .sidebar-collapsed .app-sidebar nav a.compact-secondary-link{display:none!important}
 html body .sidebar-collapsed .app-sidebar nav{gap:5px!important}
 html body .sidebar-collapsed .app-sidebar nav a{border-radius:10px!important}
 html body .sidebar-collapsed .sidebar-top{margin-bottom:10px!important}
 html body .sidebar-collapsed .sidebar-bottom{padding-top:10px!important;gap:8px}
 html body .sidebar-collapsed .sidefoot{margin-top:6px!important}
}


/* v50.13 — Spreadsheet gridlines are DATA boundaries, not dashboard strokes.
   Deliberately scoped to the editable spreadsheet cells (and legacy CSV editor).
   High specificity wins over v50.11's global !important zero-stroke contract.
   Everything outside these functional cell surfaces stays completely strokeless. */
#sheetApp{--excel-grid-line:rgba(30,43,57,.18)}
html[data-theme="modern_dark"] #sheetApp{--excel-grid-line:rgba(204,219,232,.23)}
html:root:not(#stroke-exception):not(#stroke-exception) body #sheetApp .sheet2-grid :is(th,td){
  border-style:solid!important;
  border-width:0 1px 1px 0!important;
  border-color:var(--excel-grid-line)!important;
}
/* The existing 'Görünüm > Izgara çizgilerini aç/kapat' must still work. */
html:root:not(#stroke-exception):not(#stroke-exception) body #sheetApp.hide-grid .sheet2-grid :is(th,td){
  border-color:transparent!important;
}
/* Editing and range feedback belong to cells, not decorative UI frames. */
html:root:not(#stroke-exception):not(#stroke-exception) body #sheetApp .sheet2-grid td:is(.range-cell,.multi-cell){
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--xl-green,#168b52) 35%,transparent)!important;
}
html:root:not(#stroke-exception):not(#stroke-exception) body #sheetApp .sheet2-grid td.fill-preview{
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--xl-green,#168b52) 58%,transparent)!important;
}
html:root:not(#stroke-exception):not(#stroke-exception) body #sheetApp .sheet2-grid td:is(.active-cell,.editing-cell){
  box-shadow:inset 0 0 0 2px var(--xl-green,#168b52)!important;
}
html:root:not(#stroke-exception):not(#stroke-exception) body #sheetApp .sheet2-grid td.remote-cell:not(.active-cell):not(.editing-cell){
  box-shadow:inset 0 0 0 2px var(--remote-color,var(--xl-green,#168b52))!important;
}
/* The drag-to-fill handle is a functional element inside the selected cell. */
html body #sheetApp .sheet2-grid td .fill-handle{background-color:var(--xl-green,#168b52)!important}
/* Built-in checkbox cell: use a filled surface for unchecked state. */
html body #sheetApp .sheet2-grid td .sheet-checkbox:not(.checked){
  background:color-mix(in srgb,var(--xl-text,#222) 18%,var(--xl-cell,#fff))!important;
}
/* Legacy plain table editor: its editable grid is still a spreadsheet. */
html:root:not(#stroke-exception):not(#stroke-exception) body .cloud-table :is(th,td){
  border:1px solid var(--excel-grid-legacy-line,rgba(30,43,57,.18))!important;
}
html[data-theme="modern_dark"] body .cloud-table{--excel-grid-legacy-line:rgba(204,219,232,.23)}
html:root:not(#stroke-exception):not(#stroke-exception) body .cloud-table td:focus{
  box-shadow:inset 0 0 0 2px var(--accent,#168b52)!important;
}
@media print{
  html:root:not(#stroke-exception):not(#stroke-exception) body #sheetApp .sheet2-grid :is(th,td){border:1px solid #aeb8c4!important}
  html:root:not(#stroke-exception):not(#stroke-exception) body #sheetApp.hide-grid .sheet2-grid :is(th,td){border-color:transparent!important}
}
