/* ==========================================================================
   TechGlass Mint: overrides appended to the recoloured Mint-Y base.
   Generated from templates/shell.css by tgcore.py; edit the template, not this.
   In St, background-gradient-start doubles as background-color, so hover
   rules set both gradient stops explicitly.
   ========================================================================== */

${panel_css}

.applet-label { font-weight: 600; }
#panelRight .applet-box:hover, #panelRight .applet-box:checked {
  background-color: rgba(255, 255, 255, 0.10); }

/* ---------- Window list buttons (state art is 9-slice SVG) ---------- */
.grouped-window-list-item-box,
.grouped-window-list-item-box:hover,
.grouped-window-list-item-box:active,
.grouped-window-list-item-box:checked,
.grouped-window-list-item-box:focus {
  border-width: 0;
  background-gradient-direction: none;
  background-color: rgba(0, 0, 0, 0);
  transition-duration: 120; }
.grouped-window-list-item-box:active, .grouped-window-list-item-box:checked {
  border-image: url("techglass-assets/item-running.svg") ${item_slices}; }
.grouped-window-list-item-box:hover {
  border-image: url("techglass-assets/item-hover.svg") ${item_slices}; }
.grouped-window-list-item-box:active:hover {
  border-image: url("techglass-assets/item-hover-running.svg") ${item_slices}; }
.grouped-window-list-item-box:focus, .grouped-window-list-item-box:focus:hover {
  border-image: url("techglass-assets/item-focus.svg") ${item_slices}; }
.grouped-window-list-item-demands-attention {
  background-gradient-direction: none;
  border-image: url("techglass-assets/item-attention.svg") ${item_slices}; }
.grouped-window-list-item-box .progress {
  background-color: rgba(${accent2_rgb}, 0.55);
  border-radius: ${r_item}px; }
.grouped-window-list-thumbnail-menu { border-radius: ${r_menu}px; }

/* ---------- Popup menus ---------- */
.menu, .popup-combo-menu, .appmenu-context-menu {
  color: ${text};
  background-gradient-direction: vertical;
  background-gradient-start: ${menu_top};
  background-gradient-end: ${menu_bot};
  border: 1px solid ${border};
  border-radius: ${r_menu}px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.50); }
.menu-top, .menu-bottom, .menu-left, .menu-right { border-radius: ${r_menu}px; }

.popup-menu-content { padding: 8px 0; }
.popup-menu-item {
  margin: 0 6px;
  border-radius: ${r_item}px; }
.popup-menu-item:active {
  color: #ffffff;
  background-color: rgba(${accent_rgb}, 0.16); }
.popup-sub-menu {
  margin: 2px 6px;
  border-radius: ${r_small}px;
  background-color: rgba(255, 255, 255, 0.04); }
.popup-separator-menu-item {
  -gradient-start: rgba(255, 255, 255, 0.08);
  -gradient-end: rgba(255, 255, 255, 0.08);
  -margin-horizontal: 14px; }

/* ---------- Application menu ---------- */
.appmenu-background .popup-menu-content { padding: 0; }
.appmenu-right-box { padding: 14px 14px 12px 10px; }
.appmenu-sidebar {
  background-color: rgba(255, 255, 255, 0.035);
  border: none;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: ${r_menu}px 0 0 ${r_menu}px;
  padding: 16px 0; }
.menu-top .appmenu-sidebar, .menu-bottom .appmenu-sidebar,
.menu-left .appmenu-sidebar, .menu-right .appmenu-sidebar {
  border-radius: ${r_menu}px 0 0 ${r_menu}px; }

.appmenu-category-button, .appmenu-category-button-selected, .appmenu-category-button-greyed,
.appmenu-application-button, .appmenu-application-button-selected, .appmenu-sidebar-button {
  border-radius: ${r_item}px;
  padding: 7px 9px; }
.appmenu-category-button:hover, .appmenu-sidebar-button:hover {
  background-color: rgba(255, 255, 255, 0.08);
  border-color: rgba(0, 0, 0, 0); }
.appmenu-application-button-selected, .appmenu-category-button-selected {
  background-gradient-direction: horizontal;
  background-gradient-start: rgba(${accent_rgb}, 0.34);
  background-gradient-end: rgba(${accent_rgb}, 0.10); }
.appmenu-application-button-description { color: rgba(${text_rgb}, 0.55); }

.appmenu-system-button,
.appmenu-sidebar .appmenu-system-button {
  background-color: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.10); }
.appmenu-system-button-lock:hover, .appmenu-system-button-logout:hover,
.appmenu-sidebar .appmenu-system-button-lock:hover, .appmenu-sidebar .appmenu-system-button-logout:hover {
  background-color: rgba(${accent_rgb}, 0.30); }
.appmenu-system-button-shutdown, .appmenu-sidebar .appmenu-system-button-shutdown {
  color: #ffffff;
  background-color: rgba(240, 82, 104, 0.72);
  border-color: rgba(255, 160, 175, 0.35); }
.appmenu-system-button-shutdown:hover, .appmenu-sidebar .appmenu-system-button-shutdown:hover {
  background-color: rgba(250, 96, 118, 0.92); }

#appmenu-search-entry, #menu-search-entry, .run-dialog-entry, .prompt-dialog-password-entry {
  color: ${text};
  caret-color: ${accent};
  selection-background-color: ${accent_deep};
  background-color: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: ${r_small}px;
  padding: 8px 12px;
  box-shadow: none; }
#appmenu-search-entry:hover, #appmenu-search-entry:focus,
#menu-search-entry:hover, #menu-search-entry:focus,
.run-dialog-entry:focus, .prompt-dialog-password-entry:focus {
  background-color: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(${accent_rgb}, 0.85);
  box-shadow: none; }

/* ---------- Notifications ---------- */
#notification {
  background-gradient-direction: vertical;
  background-gradient-start: ${menu_top};
  background-gradient-end: ${menu_bot};
  border: 1px solid ${border};
  border-radius: ${r_menu}px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.50);
  padding: 14px; }
.popup-menu #notification {
  border-image: none;
  background-gradient-direction: none;
  background-color: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: ${r_small}px;
  box-shadow: none; }
.notification-button, .notification-icon-button, .sound-button { border-radius: ${r_item}px; }

/* ---------- Tooltips ---------- */
#Tooltip {
  color: ${text};
  background-color: ${tooltip_bg};
  border: 1px solid ${border};
  border-radius: ${r_item}px;
  padding: 7px 12px; }

/* ---------- Alt-Tab, OSDs, dialogs ---------- */
.switcher-list, .osd-window, .info-osd, .workspace-osd {
  color: ${text};
  border-image: none;
  background-gradient-direction: vertical;
  background-gradient-start: ${osd_top};
  background-gradient-end: ${osd_bot};
  border: 1px solid ${border};
  border-radius: ${r_large}px;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.50); }
.switcher-list .item-box { border-radius: ${r_small}px; }
.switcher-list .item-box:outlined { border: 1px solid rgba(${accent_rgb}, 0.60); }
.switcher-list .item-box:selected {
  background-color: rgba(${accent_rgb}, 0.26);
  border: 1px solid rgba(${accent_rgb}, 0.55); }

.modal-dialog {
  color: ${text};
  border-image: none;
  background-gradient-direction: vertical;
  background-gradient-start: ${dialog_top};
  background-gradient-end: ${dialog_bot};
  border: 1px solid ${border};
  border-radius: ${r_large}px;
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.55); }
.modal-dialog-button-box { border-image: none; }
.modal-dialog-button { border-radius: ${r_item}px; }

/* ---------- Calendar ---------- */
.calendar-today {
  color: ${on_accent};
  background-gradient-direction: vertical;
  background-gradient-start: ${accent_light};
  background-gradient-end: ${accent};
  border-radius: 9999px; }
.calendar-day-base { border-radius: 9999px; }
.calendar-day-base:hover { background-color: rgba(255, 255, 255, 0.10); }

/* ---------- Toggles and sliders ---------- */
.popup-slider-menu-item, .slider {
  -slider-active-background-color: ${accent};
  -slider-active-border-color: ${accent}; }

/* ---------- Desklets ---------- */
.desklet-with-borders, .desklet-with-borders-and-header {
  border-image: none;
  background-gradient-direction: vertical;
  background-gradient-start: ${glass_top};
  background-gradient-end: ${glass_bot};
  border: 1px solid ${border};
  border-radius: ${r_large}px;
  padding: 18px 24px; }
.desklet-header {
  border-image: none;
  background-color: rgba(0, 0, 0, 0);
  border: none; }
.clock-desklet-label {
  color: ${text};
  font-size: 2.6em;
  font-weight: 300;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35); }

/* ---------- Overview / Expo ---------- */
.expo-background, #overview { background-color: rgba(${base_rgb}, 0.60); }
.window-caption {
  border-radius: ${r_item}px;
  background-color: ${tooltip_bg};
  border: 1px solid ${border}; }