docs(site): add data-disabled styling examples to pip and fullscreen button docs

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: mihar-22

site/src/content/docs/reference/fullscreen-button.mdx

@@ -49,6 +49,12 @@ You can style the button based on fullscreen state:
 media-fullscreen-button[data-fullscreen] {
   background: red;
 }
+
+/* Disabled (prop or feature unavailable) */
+media-fullscreen-button[data-disabled] {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
 ```
 </FrameworkCase>
 
@@ -60,6 +66,12 @@ React renders a `<button>` element. Add a `className` to style it:
 .fullscreen-button[data-fullscreen] {
   background: red;
 }
+
+/* Disabled (prop or feature unavailable) */
+.fullscreen-button[data-disabled] {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
 ```
 </FrameworkCase>
 

site/src/content/docs/reference/pip-button.mdx

@@ -49,6 +49,12 @@ You can style the button based on PiP state:
 media-pip-button[data-pip] {
   background: red;
 }
+
+/* Disabled (prop or feature unavailable) */
+media-pip-button[data-disabled] {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
 ```
 </FrameworkCase>
 
@@ -60,6 +66,12 @@ React renders a `<button>` element. Add a `className` to style it:
 .pip-button[data-pip] {
   background: red;
 }
+
+/* Disabled (prop or feature unavailable) */
+.pip-button[data-disabled] {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
 ```
 </FrameworkCase>